diff --git a/src/components/app.vue b/src/components/app.vue
index d71310e14..4ab91dcde 100644
--- a/src/components/app.vue
+++ b/src/components/app.vue
@@ -42,12 +42,11 @@ import { START_LOCATION, useRouter, useRoute } from 'vue-router';
 import Alert from './alert.vue';
 import Navbar from './navbar.vue';
 
-import useCallWait from '../composables/call-wait';
+import useCentralVersion from '../composables/central-version';
 import useDisabled from '../composables/disabled';
 import useFeatureFlags from '../composables/feature-flags';
-import { useRequestData } from '../request-data';
-import { useSessions } from '../util/session';
 import { loadAsync } from '../util/load-async';
+import { useSessions } from '../util/session';
 
 export default {
   name: 'App',
@@ -61,7 +60,9 @@ export default {
   inject: ['alert', 'config'],
   setup() {
     const { visiblyLoggedIn } = useSessions();
+    useCentralVersion();
     useDisabled();
+    const { features } = useFeatureFlags();
 
     const router = useRouter();
     const route = useRoute();
@@ -71,11 +72,7 @@ export default {
           document.documentElement.style.backgroundColor = 'var(--color-accent-secondary)';
       });
 
-    const { features } = useFeatureFlags();
-
-    const { centralVersion } = useRequestData();
-    const { callWait } = useCallWait();
-    return { visiblyLoggedIn, centralVersion, callWait, features };
+    return { features, visiblyLoggedIn };
   },
   computed: {
     routerReady() {
@@ -86,41 +83,11 @@ export default {
         this.visiblyLoggedIn;
     },
   },
-  created() {
-    this.callWait('checkVersion', this.checkVersion, (tries) =>
-      (tries === 0 ? 15000 : 60000));
-  },
   // Reset backgroundColor after each test.
   beforeUnmount() {
     document.documentElement.style.backgroundColor = '';
   },
   methods: {
-    checkVersion() {
-      const previousVersion = this.centralVersion.versionText;
-      return this.centralVersion.request({
-        url: '/version.txt',
-        clear: false,
-        alert: false
-      })
-        .then(() => {
-          if (previousVersion == null || this.centralVersion.versionText === previousVersion)
-            return false;
-
-          // Alert the user about the version change, then keep alerting them.
-          // One benefit of this approach is that the user should see the alert
-          // even if there is another alert (say, about session expiration).
-          this.callWait(
-            'alertVersionChange',
-            () => { this.alert.info(this.$t('alert.versionChange')); },
-            (count) => (count === 0 ? 0 : 60000)
-          );
-          return true;
-        })
-        // This error could be the result of logout, which will cancel all
-        // requests.
-        .catch(error =>
-          (error.response != null && error.response.status === 404));
-    },
     hideAlertAfterClick(event) {
       if (this.alert.state && event.target.closest('a[target="_blank"]') != null &&
         !event.defaultPrevented) {
diff --git a/src/components/central-version.vue b/src/components/central-version.vue
new file mode 100644
index 000000000..c56c327f3
--- /dev/null
+++ b/src/components/central-version.vue
@@ -0,0 +1,64 @@
+<!--
+Copyright 2024 ODK Central Developers
+See the NOTICE file at the top-level directory of this distribution and at
+https://github.com/getodk/central-frontend/blob/master/NOTICE.
+
+This file is part of ODK Central. It is subject to the license terms in
+the LICENSE file found in the top-level directory of this distribution and at
+https://www.apache.org/licenses/LICENSE-2.0. No part of ODK Central,
+including this file, may be copied, modified, propagated, or distributed
+except according to the terms contained in the LICENSE file.
+-->
+<template>
+  <modal id="central-version" :state="state" hideable size="large" backdrop
+    @hide="$emit('hide')">
+    <template #title>{{ $t('title') }}</template>
+    <template #body>
+      <div class="modal-introduction">
+        <p>{{ $t('shortVersion', { version: centralVersion.currentVersion }) }}</p>
+        <p>{{ $t('longVersion') }}</p>
+        <pre><code><selectable wrap>{{ centralVersion.versionText }}</selectable></code></pre>
+      </div>
+      <div class="modal-actions">
+        <button type="button" class="btn btn-primary" @click="$emit('hide')">
+          {{ $t('action.close') }}
+        </button>
+      </div>
+    </template>
+  </modal>
+</template>
+
+<script setup>
+import Modal from './modal.vue';
+import Selectable from './selectable.vue';
+
+import useCentralVersion from '../composables/central-version';
+
+defineOptions({
+  name: 'CentralVersion'
+});
+defineProps({
+  state: Boolean
+});
+defineEmits(['hide']);
+
+const centralVersion = useCentralVersion();
+</script>
+
+<style lang="scss">
+#central-version {
+  .loading { min-height: 120px; }
+}
+</style>
+
+<i18n lang="json5">
+{
+  "en": {
+    // This is the title at the top of a pop-up. It refers to the version of ODK
+    // Central that the user is using.
+    "title": "Central Version",
+    "shortVersion": "You are using ODK Central {version}.",
+    "longVersion": "You can find more detailed version information below:"
+  }
+}
+</i18n>
diff --git a/src/components/navbar.vue b/src/components/navbar.vue
index f4dd8fa85..8e3b1ef50 100644
--- a/src/components/navbar.vue
+++ b/src/components/navbar.vue
@@ -32,7 +32,7 @@ except according to the terms contained in the LICENSE file.
               {{ $t('analyticsNotice') }}
             </a>
             <ul class="nav navbar-nav">
-              <navbar-help-dropdown/>
+              <navbar-help-dropdown @show-version="versionModal.show()"/>
               <navbar-locale-dropdown/>
               <navbar-actions/>
             </ul>
@@ -40,6 +40,9 @@ except according to the terms contained in the LICENSE file.
         </div>
       </div>
     </nav>
+
+    <central-version-component v-if="centralVersion != null"
+      v-bind="versionModal" @hide="versionModal.hide()"/>
     <analytics-introduction v-if="config.loaded && config.showsAnalytics"
       v-bind="analyticsIntroduction" @hide="analyticsIntroduction.hide()"/>
   </div>
@@ -48,11 +51,13 @@ except according to the terms contained in the LICENSE file.
 <script>
 import { defineAsyncComponent } from 'vue';
 
+import CentralVersion from './central-version.vue';
 import NavbarActions from './navbar/actions.vue';
 import NavbarHelpDropdown from './navbar/help-dropdown.vue';
 import NavbarLinks from './navbar/links.vue';
 import NavbarLocaleDropdown from './navbar/locale-dropdown.vue';
 
+import useCentralVersion from '../composables/central-version';
 import useRoutes from '../composables/routes';
 import { loadAsync } from '../util/load-async';
 import { modalData } from '../util/reactivity';
@@ -62,6 +67,7 @@ export default {
   name: 'Navbar',
   components: {
     AnalyticsIntroduction: defineAsyncComponent(loadAsync('AnalyticsIntroduction')),
+    CentralVersionComponent: CentralVersion,
     NavbarActions,
     NavbarHelpDropdown,
     NavbarLinks,
@@ -72,11 +78,13 @@ export default {
     // The component does not assume that this data will exist when the
     // component is created.
     const { currentUser, analyticsConfig } = useRequestData();
+    const centralVersion = useCentralVersion();
     const { canRoute } = useRoutes();
-    return { currentUser, analyticsConfig, canRoute };
+    return { currentUser, analyticsConfig, centralVersion, canRoute };
   },
   data() {
     return {
+      versionModal: modalData(),
       analyticsIntroduction: modalData('AnalyticsIntroduction')
     };
   },
diff --git a/src/components/navbar/help-dropdown.vue b/src/components/navbar/help-dropdown.vue
index ba063caf5..60f7f0550 100644
--- a/src/components/navbar/help-dropdown.vue
+++ b/src/components/navbar/help-dropdown.vue
@@ -23,7 +23,9 @@ except according to the terms contained in the LICENSE file.
         <a href="https://forum.getodk.org/" target="_blank">{{ $t('common.forum') }}</a>
       </li>
       <li>
-        <a href="/version.txt" target="_blank">{{ $t('common.version') }}</a>
+        <a href="/version.txt" target="_blank" @click="showVersion">
+          {{ $t('common.version') }}
+        </a>
       </li>
     </ul>
   </li>
@@ -32,9 +34,20 @@ except according to the terms contained in the LICENSE file.
 <script setup>
 import DocLink from '../doc-link.vue';
 
+import useCentralVersion from '../../composables/central-version';
+
 defineOptions({
   name: 'NavbarHelpDropdown'
 });
+const emit = defineEmits(['show-version']);
+
+const centralVersion = useCentralVersion();
+const showVersion = (event) => {
+  if (centralVersion.value != null) {
+    event.preventDefault();
+    emit('show-version');
+  }
+};
 </script>
 
 <i18n lang="json5">
diff --git a/src/components/outdated-version.vue b/src/components/outdated-version.vue
index 20ca1a1e4..929dab4d1 100644
--- a/src/components/outdated-version.vue
+++ b/src/components/outdated-version.vue
@@ -32,42 +32,45 @@ except according to the terms contained in the LICENSE file.
 
 <script setup>
 import { computed, inject } from 'vue';
-import { useRequestData } from '../request-data';
 
-const { centralVersion, currentUser } = useRequestData();
+import useCentralVersion from '../composables/central-version';
+import { useRequestData } from '../request-data';
 
 defineOptions({
   name: 'OutdatedVersion'
 });
 
+const { currentUser } = useRequestData();
+
 const visiblyLoggedIn = inject('visiblyLoggedIn');
 
 const container = inject('container');
-const { i18n: globalI18n } = container;
+const { i18n: globalI18n, currentDate } = container;
 const locale = computed(() => globalI18n.locale);
 
-const iframeSrc = computed(() => `https://getodk.github.io/central/outdated-version.html?version=${centralVersion.currentVersion}&lang=${locale.value}`);
+const centralVersion = useCentralVersion();
+const iframeSrc = computed(() => `https://getodk.github.io/central/outdated-version.html?version=${centralVersion.value.currentVersion}&lang=${locale.value}`);
 
 const showBanner = computed(() => {
   // user is not logged in or doesn't have ability to set config (implying not an admin)
   if (!currentUser.dataExists || !visiblyLoggedIn || !currentUser.can('config.set')) return false;
-  if (!centralVersion.dataExists) return false;
+  if (centralVersion.value == null) return false;
 
   // User has seen the warning in the last 30 days, so don't show it again
   // 864E5 is the number of milliseconds in a day
   const dismissDate = currentUser.preferences?.site?.outdatedVersionWarningDismissDate;
-  if (dismissDate && centralVersion.currentDate.getTime() < (new Date(dismissDate).getTime() + (864E5 * 30))) return false;
+  if (dismissDate && currentDate.value.getTime() < (new Date(dismissDate).getTime() + (864E5 * 30))) return false;
 
   // Difference between current year and Central version year is less than 2
-  const centralVersionYear = Number(centralVersion.currentVersion.match(/^(\d{4})/)[1]);
-  const currentYear = centralVersion.currentDate.getFullYear();
+  const centralVersionYear = Number(centralVersion.value.currentVersion.match(/^(\d{4})/)[1]);
+  const currentYear = currentDate.value.getFullYear();
   if (currentYear - centralVersionYear < 2) return false;
 
   return true;
 });
 
 const dismiss = () => {
-  currentUser.preferences.site.outdatedVersionWarningDismissDate = centralVersion.currentDate;
+  currentUser.preferences.site.outdatedVersionWarningDismissDate = currentDate.value;
 };
 </script>
 
diff --git a/src/components/selectable.vue b/src/components/selectable.vue
index 7aa79de73..4270e196c 100644
--- a/src/components/selectable.vue
+++ b/src/components/selectable.vue
@@ -10,7 +10,7 @@ including this file, may be copied, modified, propagated, or distributed
 except according to the terms contained in the LICENSE file.
 -->
 <template>
-  <div ref="el" class="selectable" @click="select"><!-- eslint-disable-line vuejs-accessibility/click-events-have-key-events, vue/multiline-html-element-content-newline -->
+  <div ref="el" class="selectable" :class="{ scroll: !wrap }" @click="select"><!-- eslint-disable-line vuejs-accessibility/click-events-have-key-events, vue/multiline-html-element-content-newline -->
     <slot></slot>
   </div>
 </template>
@@ -18,6 +18,10 @@ except according to the terms contained in the LICENSE file.
 <script setup>
 import { ref } from 'vue';
 
+defineProps({
+  wrap: Boolean
+});
+
 const el = ref(null);
 const select = () => {
   const selection = getSelection();
@@ -31,7 +35,10 @@ const select = () => {
 
 .selectable {
   font-family: $font-family-monospace;
-  overflow-x: auto;
-  white-space: nowrap;
+
+  &.scroll {
+    overflow-x: auto;
+    white-space: nowrap;
+  }
 }
 </style>
diff --git a/src/composables/central-version.js b/src/composables/central-version.js
new file mode 100644
index 000000000..f106fbb6b
--- /dev/null
+++ b/src/composables/central-version.js
@@ -0,0 +1,61 @@
+/*
+Copyright 2024 ODK Central Developers
+See the NOTICE file at the top-level directory of this distribution and at
+https://github.com/getodk/central-frontend/blob/master/NOTICE.
+
+This file is part of ODK Central. It is subject to the license terms in
+the LICENSE file found in the top-level directory of this distribution and at
+https://www.apache.org/licenses/LICENSE-2.0. No part of ODK Central,
+including this file, may be copied, modified, propagated, or distributed
+except according to the terms contained in the LICENSE file.
+*/
+import { F } from 'ramda';
+import { computed, watchEffect } from 'vue';
+
+import useCallWait from './call-wait';
+import { memoizeForContainer } from '../util/composable';
+import { useRequestData } from '../request-data';
+
+export default memoizeForContainer(({ i18n, alert, config }) => {
+  const centralVersion = computed(() => {
+    if (!config.dataExists) return null;
+    const versionText = config.centralVersion;
+    if (versionText == null) return null;
+    return {
+      versionText,
+      currentVersion: versionText.match(/\(v(\d{4}[^-]*)/)[1]
+    };
+  });
+
+  // Check for a change to /version.txt.
+  const { createResource } = useRequestData();
+  const latestVersion = createResource('latestVersion');
+  const { callWait } = useCallWait();
+  // Alerts the user about a version change, then keep alerting them. One
+  // benefit of this approach is that the user should see the alert even if
+  // there is another alert (say, about session expiration).
+  const alertAboutChange = () => {
+    callWait(
+      'centralVersion.alert',
+      () => { alert.info(i18n.t('alert.versionChange')); },
+      (count) => (count === 0 ? 0 : 60000)
+    );
+  };
+  watchEffect(() => {
+    if (centralVersion.value == null) return;
+    callWait(
+      'centralVersion.check',
+      () => latestVersion.request({ url: '/version.txt', alert: false })
+        .then(() => {
+          if (latestVersion.data === centralVersion.value.versionText)
+            return false;
+          alertAboutChange();
+          return true;
+        })
+        .catch(F),
+      () => 60000
+    );
+  });
+
+  return centralVersion;
+});
diff --git a/src/config.js b/src/config.js
index 260450e1a..900da72a7 100644
--- a/src/config.js
+++ b/src/config.js
@@ -13,6 +13,9 @@ except according to the terms contained in the LICENSE file.
 // These are the default config values. They will be merged with the response
 // for /client-config.json.
 export default {
+  centralVersion: process.env.NODE_ENV === 'development'
+    ? `(v${new Date().getFullYear()}.1.0-sha)\nNote: fake version for development.`
+    : null,
   // `true` to allow navigation to /system/analytics and `false` not to.
   showsAnalytics: true,
   home: {
diff --git a/src/container.js b/src/container.js
index aeacf654e..edf49256e 100644
--- a/src/container.js
+++ b/src/container.js
@@ -11,6 +11,7 @@ except according to the terms contained in the LICENSE file.
 */
 import axios from 'axios';
 import { Translation } from 'vue-i18n';
+import { shallowRef } from 'vue';
 
 import createAlert from './alert';
 import createCentralI18n from './i18n';
@@ -25,6 +26,7 @@ const provide = [
   'hoverCard',
   'unsavedChanges',
   'config',
+  'currentDate',
   'http',
   'logger'
 ];
@@ -41,6 +43,7 @@ export default ({
   alert = createAlert(),
   hoverCard = createHoverCard(),
   unsavedChanges = createUnsavedChanges(i18n.global),
+  currentDate = null,
   http = axios,
   // Adding `logger` in part in order to silence certain logging during testing.
   logger = console
@@ -50,6 +53,8 @@ export default ({
     alert,
     hoverCard,
     unsavedChanges,
+    // The current date according to the latest Date header received
+    currentDate: shallowRef(currentDate),
     http,
     logger
   };
diff --git a/src/main.js b/src/main.js
index bff5590cb..6bd8a3c28 100644
--- a/src/main.js
+++ b/src/main.js
@@ -15,8 +15,6 @@ import { createApp } from 'vue';
 // components' styles.
 import './styles';
 
-import App from './components/app.vue';
-
 import createContainer from './container';
 import vTooltip from './directives/tooltip';
 // ./jquery must be imported before any of Bootstrap's JavaScript plugins,
@@ -24,6 +22,9 @@ import vTooltip from './directives/tooltip';
 import './jquery';
 import './bootstrap';
 
+// App must be imported after the Bootstrap modal plugin.
+import App from './components/app.vue';
+
 createApp(App)
   .use(createContainer())
   .directive('tooltip', vTooltip)
diff --git a/src/request-data/resource.js b/src/request-data/resource.js
index 2ce2e7f0f..d1eb932a4 100644
--- a/src/request-data/resource.js
+++ b/src/request-data/resource.js
@@ -221,14 +221,14 @@ class Resource extends BaseResource {
     const abortController = new AbortController();
     this[_abortController] = abortController;
     axiosConfig.signal = abortController.signal;
-    const { router, i18n, requestData, alert, http, logger } = this[_container];
+    const { router, i18n, requestData, alert, currentDate, http, logger } = this[_container];
     // `router` may be `null` in testing.
     const removeHook = router == null || method === 'GET'
       ? noop
       : router.afterEach(unlessFailure(() => { abortController.abort(); }));
 
     this[_store].awaitingResponse = true;
-    const cleanup = () => {
+    const cleanup = (response) => {
       // Each request is associated with its own AbortController. If another
       // request is sent for this same resource, then that will cancel this
       // request and immediately set this[_abortController] to the
@@ -245,20 +245,25 @@ class Resource extends BaseResource {
       // then that will cause cleanup() to be called very soon, yet
       // asynchronously (in a different tick from the navigation hook).
       removeHook();
+
+      if (response != null)
+        currentDate.value = new Date(response.headers.get('date'));
     };
 
     return http.request(withAuth(axiosConfig, requestData.session.token))
       .catch(error => {
+        const { response } = error;
+
         if (abortController.signal.aborted) {
-          cleanup();
+          cleanup(response);
           throw new Error('request was canceled');
         }
 
-        if (fulfillProblem != null && error.response != null &&
-          isProblem(error.response.data) && fulfillProblem(error.response.data))
-          return error.response;
+        if (fulfillProblem != null && response != null &&
+          isProblem(response.data) && fulfillProblem(response.data))
+          return response;
 
-        cleanup();
+        cleanup(response);
 
         if (alertOption) {
           logAxiosError(logger, error);
@@ -268,7 +273,7 @@ class Resource extends BaseResource {
         throw error;
       })
       .then(response => {
-        cleanup();
+        cleanup(response);
         if (abortController.signal.aborted)
           throw new Error('request was canceled');
 
diff --git a/src/request-data/resources.js b/src/request-data/resources.js
index f251aa779..6de37c8af 100644
--- a/src/request-data/resources.js
+++ b/src/request-data/resources.js
@@ -42,14 +42,6 @@ export default (container, createResource) => {
       : configDefaults),
     loaded: computed(() => config.dataExists && config.loadError == null)
   }));
-  createResource('centralVersion', () => ({
-    transformResponse: ({ data, headers }) =>
-      shallowReactive({
-        versionText: data,
-        currentVersion: data.match(/\(v(\d{4}[^-]*)/)[1],
-        currentDate: new Date(headers.get('date'))
-      })
-  }));
   createResource('analyticsConfig', noargs(setupOption));
   createResource('roles', (roles) => ({
     bySystem: computeIfExists(() => {
diff --git a/src/routes.js b/src/routes.js
index d489910f2..601fe8915 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -774,7 +774,6 @@ const routesByName = new Map();
     requestData.session,
     currentUser,
     config,
-    requestData.centralVersion,
     requestData.analyticsConfig,
     requestData.roles
   ]);
diff --git a/src/util/session.js b/src/util/session.js
index cfaf41861..2c7c03d89 100644
--- a/src/util/session.js
+++ b/src/util/session.js
@@ -113,7 +113,7 @@ const requestLogout = ({ i18n, requestData, alert, http }) => {
 // Resets requestData, clearing data and canceling requests. Some general/system
 // resources are not reset.
 const resetRequestData = (requestData) => {
-  const preserve = new Set([requestData.config, requestData.centralVersion]);
+  const preserve = new Set([requestData.config]);
   for (const resource of requestData.resources) {
     if (!preserve.has(resource)) resource.reset();
   }
diff --git a/test/components/app.spec.js b/test/components/app.spec.js
index a26e66ace..ed54b0268 100644
--- a/test/components/app.spec.js
+++ b/test/components/app.spec.js
@@ -2,8 +2,6 @@ import sinon from 'sinon';
 
 import Home from '../../src/components/home.vue';
 
-import { logOut } from '../../src/util/session';
-
 import { load } from '../util/http';
 import { mockLogin } from '../util/session';
 import FeedbackButton from '../../src/components/feedback-button.vue';
@@ -12,47 +10,14 @@ describe('App', () => {
   describe('change in Central version', () => {
     beforeEach(mockLogin);
 
-    it('sends the correct request', () => {
-      const clock = sinon.useFakeTimers(Date.now());
-      return load('/')
-        .complete()
-        .request(() => {
-          clock.tick(15000);
-        })
-        // This isn't actually what a version looks like. However, the value
-        // itself doesn't really matter, but rather only whether it changes.
-        .respondWithData(() => '(v2024.1.2-sha)')
-        .testRequests([{ url: '/version.txt' }]);
-    });
-
-    it('re-sends the request after 60 seconds', () => {
-      const clock = sinon.useFakeTimers(Date.now());
-      return load('/')
-        .complete()
-        .request(() => {
-          clock.tick(15000);
-        })
-        .respondWithData(() => '(v2024.1.2-sha)')
-        .complete()
-        .request(() => {
-          clock.tick(60000);
-        })
-        .respondWithData(() => '(v2024.1.2-sha)')
-        .testRequests([{ url: '/version.txt' }]);
-    });
-
     describe('after a version change', () => {
       it('shows an alert', () => {
         const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
+        const container = {
+          config: { centralVersion: '(v2024.1.2-sha)' }
+        };
+        return load('/', { container })
           .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
-          .afterResponse(app => {
-            app.should.not.alert();
-          })
           .request(() => {
             clock.tick(60000);
           })
@@ -74,12 +39,10 @@ describe('App', () => {
 
       it('stops sending the request', () => {
         const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
+        const container = {
+          config: { centralVersion: '(v2024.1.2-sha)' }
+        };
+        return load('/', { container })
           .complete()
           .request(() => {
             clock.tick(60000);
@@ -93,12 +56,10 @@ describe('App', () => {
 
       it('keeps alerting the user', () => {
         const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
+        const container = {
+          config: { centralVersion: '(v2024.1.2-sha)' }
+        };
+        return load('/', { container })
           .complete()
           .request(() => {
             clock.tick(60000);
@@ -115,82 +76,23 @@ describe('App', () => {
       });
     });
 
-    describe('request error', () => {
-      it('stops sending the request after a 404', () => {
-        const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respond(() => ({ status: 404, data: '' }))
-          .complete()
-          .testNoRequest(() => {
-            clock.tick(60000);
-          });
-      });
-
-      it('does not stop sending request after a different response error', () => {
-        const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respond(() => ({ status: 500, data: '' }))
-          .complete()
-          .request(() => {
-            clock.tick(60000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
-          .testRequests([{ url: '/version.txt' }]);
-      });
-
-      it('does not stop sending the request if it is canceled during logout', () => {
-        const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .beforeEachResponse((app, { url }) => {
-            if (url === '/version.txt') logOut(app.vm.$container, false);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
-          .respondWithSuccess()
-          .complete()
-          .request(() => {
-            clock.tick(60000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
-          .testRequests([{ url: '/version.txt' }]);
-      });
-
-      it('shows an alert despite an intermediate error', () => {
-        const clock = sinon.useFakeTimers(Date.now());
-        return load('/')
-          .complete()
-          .request(() => {
-            clock.tick(15000);
-          })
-          .respondWithData(() => '(v2024.1.2-sha)')
-          .complete()
-          .request(() => {
-            clock.tick(60000);
-          })
-          .respond(() => ({ status: 500, data: '' }))
-          .complete()
-          .request(() => {
-            clock.tick(60000);
-          })
-          .respondWithData(() => '(v2024.1.3-sha)')
-          .afterResponse(app => {
-            clock.tick(0);
-            app.should.alert('info', (message) => {
-              message.should.startWith('The server has been updated.');
-            });
-          });
-      });
+    it('does not stop sending request after a response error', () => {
+      const clock = sinon.useFakeTimers(Date.now());
+      const container = {
+        config: { centralVersion: '(v2024.1.2-sha)' }
+      };
+      return load('/', { container })
+        .complete()
+        .request(() => {
+          clock.tick(60000);
+        })
+        .respond(() => ({ status: 500, data: '' }))
+        .complete()
+        .request(() => {
+          clock.tick(60000);
+        })
+        .respondWithData(() => '(v2024.1.2-sha)')
+        .testRequests([{ url: '/version.txt' }]);
     });
   });
 
diff --git a/test/components/form/head.spec.js b/test/components/form/head.spec.js
index a7fb35814..618901cc6 100644
--- a/test/components/form/head.spec.js
+++ b/test/components/form/head.spec.js
@@ -1,6 +1,7 @@
 import FormDraftStatus from '../../../src/components/form-draft/status.vue';
 import FormHead from '../../../src/components/form/head.vue';
 import FormOverview from '../../../src/components/form/overview.vue';
+import FormShow from '../../../src/components/form/show.vue';
 import Loading from '../../../src/components/loading.vue';
 import Breadcrumbs from '../../../src/components/breadcrumbs.vue';
 
@@ -262,7 +263,7 @@ describe('FormHead', () => {
           .complete()
           .request(app => app.get('#form-head-create-draft-button').trigger('click'))
           .beforeAnyResponse(app => {
-            app.getComponent(Loading).should.be.visible();
+            app.getComponent(FormShow).getComponent(Loading).should.be.visible();
             app.getComponent(FormHead).should.be.hidden();
             app.getComponent(FormOverview).element.parentNode.should.be.hidden();
           })
diff --git a/test/components/form/show.spec.js b/test/components/form/show.spec.js
index 9fa5fe601..0ee578176 100644
--- a/test/components/form/show.spec.js
+++ b/test/components/form/show.spec.js
@@ -1,5 +1,4 @@
 import FormOverview from '../../../src/components/form/overview.vue';
-import Loading from '../../../src/components/loading.vue';
 import NotFound from '../../../src/components/not-found.vue';
 
 import testData from '../../data';
@@ -65,23 +64,4 @@ describe('FormShow', () => {
         expect(app.getComponent(FormOverview).vm).to.not.equal(vm);
       });
   });
-
-  it('shows a loading message until all responses are received', () => {
-    testData.extendedProjects.createPast(1);
-    testData.extendedForms.createPast(1, { xmlFormId: 'f', draft: false });
-    testData.standardFormAttachments.createPast(1);
-    return load('/projects/1/forms/f')
-      .beforeEachResponse((app, req) => {
-        const loading = app.findAllComponents('.loading:not(#form-overview .loading)'); // select all loading components except FormOverview's
-        loading.length.should.equal(2);
-        if (req.url !== '/v1/projects/1/forms/f/attachments') { // skip form/f/attachments because it is requested from FormOverview
-          loading[0].props().state.should.eql(true);
-        }
-      })
-      .afterResponses(app => {
-        const loading = app.findAllComponents(Loading);
-        loading.length.should.equal(3);
-        loading[0].props().state.should.eql(false);
-      });
-  });
 });
diff --git a/test/components/outdated-version.spec.js b/test/components/outdated-version.spec.js
index eafbddce1..8fa43db27 100644
--- a/test/components/outdated-version.spec.js
+++ b/test/components/outdated-version.spec.js
@@ -1,28 +1,25 @@
-import { mount } from '../util/lifecycle';
 import OutdatedVersion from '../../src/components/outdated-version.vue';
-import { mockLogin } from '../util/session';
+
+import { loadLocale } from '../../src/util/i18n';
+
 import testData from '../data';
 import { mockHttp } from '../util/http';
-import { loadLocale } from '../../src/util/i18n';
+import { mockLogin } from '../util/session';
+import { mount } from '../util/lifecycle';
 
 const mountOptions = (options) => ({
   global: {
     provide: { visiblyLoggedIn: options.userLoggedIn ?? true }
   },
   container: {
-    requestData: {
-      centralVersion: {
-        status: 200,
-        data: options.centralVersion,
-        headers: new Map([['date', options.currentDate ? new Date(options.currentDate) : new Date()]])
-      }
-    }
+    config: { centralVersion: options.centralVersion },
+    currentDate: options.currentDate ? new Date(options.currentDate) : new Date()
   }
 });
 
 const mountComponent = (options) => mount(OutdatedVersion, mountOptions(options));
 
-describe('OutdatedVersionBanner', () => {
+describe('OutdatedVersion', () => {
   const cases = [
     {
       description: 'user is not logged in',
diff --git a/test/request-data/resource.spec.js b/test/request-data/resource.spec.js
index e472c23cd..dae16587c 100644
--- a/test/request-data/resource.spec.js
+++ b/test/request-data/resource.spec.js
@@ -5,6 +5,7 @@ import { noop } from '../../src/util/util';
 import createTestContainer from '../util/container';
 import testData from '../data';
 import { mockHttp } from '../util/http';
+import { mockResponseHeaders } from '../util/axios';
 
 describe('createResource()', () => {
   describe('request()', () => {
@@ -96,6 +97,45 @@ describe('createResource()', () => {
       });
     });
 
+    describe('currentDate', () => {
+      it('sets currentDate after a successful response', () => {
+        const container = createTestContainer();
+        const { requestData, currentDate } = container;
+        return mockHttp(container)
+          .request(() => requestData.project.request({ url: '/v1/projects/1' }))
+          .respond(() => ({
+            status: 200,
+            data: testData.extendedProjects.createNew(),
+            headers: mockResponseHeaders({
+              Date: 'Tue, 17 Dec 2024 01:23:45 GMT'
+            })
+          }))
+          .afterResponse(() => {
+            const iso = currentDate.value.toISOString();
+            iso.should.equal('2024-12-17T01:23:45.000Z');
+          });
+      });
+
+      it('sets currentDate after an error response', () => {
+        const container = createTestContainer();
+        const { requestData, currentDate } = container;
+        return mockHttp(container)
+          .request(() =>
+            requestData.project.request({ url: '/v1/projects/1' }).catch(noop))
+          .respond(() => ({
+            status: 404,
+            data: { code: 404.1, message: 'Not found' },
+            headers: mockResponseHeaders({
+              Date: 'Tue, 17 Dec 2024 01:23:45 GMT'
+            })
+          }))
+          .afterResponse(() => {
+            const iso = currentDate.value.toISOString();
+            iso.should.equal('2024-12-17T01:23:45.000Z');
+          });
+      });
+    });
+
     describe('convenience methods for HTTP verbs', () => {
       it('sends the correct request', () => {
         const container = createTestContainer();
diff --git a/test/unit/session.spec.js b/test/unit/session.spec.js
index 2dd4a22ca..1b6939067 100644
--- a/test/unit/session.spec.js
+++ b/test/unit/session.spec.js
@@ -593,12 +593,7 @@ describe('util/session', () => {
         .respondFor('/', { users: false })
         .complete()
         .request(() => {
-          clock.tick(15000);
-        })
-        .respond(() => ({ status: 404, data: '' })) // /version.txt
-        .complete()
-        .request(() => {
-          clock.tick(225000);
+          clock.tick(240000);
         })
         .respondWithSuccess()
         .afterResponse(app => {
diff --git a/test/util/axios.js b/test/util/axios.js
index 81bc526c8..bdc8cbc9e 100644
--- a/test/util/axios.js
+++ b/test/util/axios.js
@@ -1,3 +1,5 @@
+import { DateTime } from 'luxon';
+
 const _mockError = (message, config) => {
   const error = new Error(message);
   error.config = config;
@@ -45,6 +47,16 @@ export const mockAxios = () => {
   return http;
 };
 
+export const mockResponseHeaders = (headers = {}) => {
+  const map = new Map();
+  for (const [name, value] of Object.entries(headers))
+    map.set(name.toLowerCase(), value);
+
+  if (!map.has('date')) map.set('date', DateTime.local().toHTTP());
+
+  return map;
+};
+
 export const mockResponse = {
   // Given a Problem object or a Problem code, returns a Problem response. (Note
   // that the response will not have a `config` property.)
@@ -52,7 +64,7 @@ export const mockResponse = {
     const data = typeof problemOrCode === 'object'
       ? problemOrCode
       : { code: problemOrCode, message: 'There was a problem.' };
-    return { status: Math.floor(data.code), data };
+    return { status: Math.floor(data.code), data, headers: mockResponseHeaders() };
   },
   // Converts an object that may be a response to a response. If the object
   // looks like a response, it is returned as-is. Otherwise a 200 response is
@@ -60,8 +72,13 @@ export const mockResponse = {
   // will not have a `config` property.)
   of: (responseOrData) => {
     if (typeof responseOrData === 'object' &&
-      typeof responseOrData.status === 'number' && responseOrData.data != null)
-      return responseOrData;
-    return { status: 200, data: responseOrData };
+      typeof responseOrData.status === 'number' && responseOrData.data != null) {
+      const { headers } = responseOrData;
+      return headers != null
+        ? responseOrData
+        : { ...responseOrData, headers: mockResponseHeaders() };
+    }
+
+    return { status: 200, data: responseOrData, headers: mockResponseHeaders() };
   }
 };
diff --git a/test/util/container.js b/test/util/container.js
index 43f0e144e..f39429f5a 100644
--- a/test/util/container.js
+++ b/test/util/container.js
@@ -1,6 +1,6 @@
 import createContainer from '../../src/container';
 
-import { mockAxios } from './axios';
+import { mockAxios, mockResponse } from './axios';
 import { mockLogger } from './util';
 import { testRequestData } from './request-data';
 
@@ -23,12 +23,13 @@ export default ({ requestData, config = {}, ...options } = {}) => {
     requestData: typeof requestData === 'function'
       ? requestData
       : testRequestData([], requestData),
+    currentDate: new Date(),
     http: mockAxios(),
     logger: mockLogger(),
     ...options
   });
   if (config !== false)
-    container.requestData.config.setFromResponse({ status: 200, data: config });
+    container.requestData.config.setFromResponse(mockResponse.of(config));
   if (container.requestData.seed != null) container.requestData.seed();
   return container;
 };
diff --git a/test/util/http.js b/test/util/http.js
index 15801b3ca..027de6f0d 100644
--- a/test/util/http.js
+++ b/test/util/http.js
@@ -286,7 +286,7 @@ import requestDataByComponent from './http/data';
 import testData from '../data';
 import * as commonTests from './http/common';
 import { loadAsyncCache } from './load-async';
-import { mockAxiosError, mockResponse } from './axios';
+import { mockAxiosError, mockResponse, mockResponseHeaders } from './axios';
 import { mockRouter, setInstallLocation, testRouter } from './router';
 import { mount as lifecycleMount, withSetup } from './lifecycle';
 import { setRequestData } from './request-data';
@@ -686,24 +686,25 @@ class MockHttp {
         .then(() => new Promise((resolve, reject) => {
           this._responseCount += 1;
 
-          let responseWithoutConfig;
+          let response;
           try {
             const callback = this._responses[index];
-            responseWithoutConfig = callback();
+            response = callback();
           } catch (e) {
             if (this._errorFromResponse == null) this._errorFromResponse = e;
             reject(e);
             return;
           }
 
-          const { data } = responseWithoutConfig;
+          const { data } = response;
           if (typeof data === 'object' && data != null)
-            responseWithoutConfig.data = clone(data);
+            response.data = clone(data);
+          if (response.headers == null)
+            response.headers = mockResponseHeaders();
+          // Add `response` to the log before adding `config` to it.
+          this._requestResponseLog.push({ ...response });
+          response.config = config;
 
-          this._requestResponseLog.push(responseWithoutConfig);
-
-          const response = { ...responseWithoutConfig, config };
-          response.headers = new Map([['date', new Date()], ...(response.headers ?? [])]);
           if (response.status >= 200 && response.status < 300)
             resolve(response);
           else
diff --git a/transifex/strings_en.json b/transifex/strings_en.json
index eae7d4031..6ffb7fa9b 100644
--- a/transifex/strings_en.json
+++ b/transifex/strings_en.json
@@ -1506,6 +1506,18 @@
         }
       }
     },
+    "CentralVersion": {
+      "title": {
+        "string": "Central Version",
+        "developer_comment": "This is the title at the top of a pop-up. It refers to the version of ODK Central that the user is using."
+      },
+      "shortVersion": {
+        "string": "You are using ODK Central {version}."
+      },
+      "longVersion": {
+        "string": "You can find more detailed version information below:"
+      }
+    },
     "CollectQr": {
       "draft": {
         "string": "Temporary Testing Code",