diff --git a/web/error-boundary.react.js b/web/error-boundary.react.js
--- a/web/error-boundary.react.js
+++ b/web/error-boundary.react.js
@@ -3,8 +3,10 @@
 import * as React from 'react';
 
 import type { ErrorInfo, ErrorData } from 'lib/types/report-types.js';
+import { getMessageForException } from 'lib/utils/errors.js';
 
 import css from './error-boundary.css';
+import { getVersionUnsupportedError } from './utils/version-utils.js';
 
 type Props = {
   +children: React.Node,
@@ -29,9 +31,22 @@
 
   render(): React.Node {
     if (this.state.errorData.length > 0) {
+      const versionUnsupportedError = this.state.errorData.find(e => {
+        const messageForException = getMessageForException(e.error);
+        return (
+          messageForException === 'client_version_unsupported' ||
+          messageForException === 'unsupported_version'
+        );
+      });
+
+      let message = 'Something has gone wrong, please reload the page';
+      if (versionUnsupportedError) {
+        message = getVersionUnsupportedError();
+      }
+
       return (
         <div className={css.container}>
-          <h3>Something has gone wrong, please reload the page</h3>
+          <h3>{message}</h3>
         </div>
       );
     }