DEP Update code to work with upgraded deps

client/src/bundles/bundle.js

@@ -5,9 +5,9 @@
  */
 
 // Expose fields (see webpack config for matching "externals" config)
-require('expose-loader?HistoryViewer!components/HistoryViewer/HistoryViewer');
+require('expose-loader?exposes=HistoryViewer!components/HistoryViewer/HistoryViewer');
 
-require('expose-loader?versionType!types/versionType');
+require('expose-loader?exposes=versionType!types/versionType');
 
 // Legacy CMS
 require('../legacy/ArchiveAdmin/ArchiveAdmin');

client/src/legacy/HistoryViewer/HistoryViewerEntwine.js

@@ -1,6 +1,7 @@
 import jQuery from 'jquery';
 import React from 'react';
 import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { loadComponent } from 'lib/Injector';
 
 /**
@@ -9,6 +10,8 @@ import { loadComponent } from 'lib/Injector';
  */
 jQuery.entwine('ss', ($) => {
   $('.js-injector-boot .history-viewer__container').entwine({
+    ReactRoot: null,
+
     onmatch() {
       const cmsContent = this.closest('.cms-content').attr('id');
       const context = (cmsContent)
@@ -25,14 +28,17 @@ jQuery.entwine('ss', ($) => {
         isInGridField: schemaData.data.isInGridField || !this.hasClass('history-viewer--standalone'),
       };
 
-      ReactDOM.render(
-        <HistoryViewerComponent {...props} />,
-        this[0]
-      );
+      const root = createRoot(this[0]);
+      root.render(<HistoryViewerComponent {...props} />);
+      this.setReactRoot(root);
     },
 
     onunmatch() {
-      ReactDOM.unmountComponentAtNode(this[0]);
+      const root = this.getReactRoot();
+      if (root) {
+        root.unmount();
+        this.setReactRoot(null);
+      }
     }
   });
 

client/src/state/historyviewer/HistoryViewerActions.js

@@ -1,5 +1,5 @@
+import { v1 as uuidv1 } from 'uuid';
 import HISTORY_VIEWER from './HistoryViewerActionTypes';
-import uuidv1 from 'uuid/v1';
 
 /**
  * Setting the current version will enable context views for a specific record

client/src/types/versionType.js

@@ -11,11 +11,11 @@ const versionType = PropTypes.shape({
   version: PropTypes.number,
   absoluteLink: PropTypes.string,
   lastEdited: PropTypes.string,
-  published: PropTypes.boolean,
-  draft: PropTypes.boolean,
-  deleted: PropTypes.boolean,
-  liveVersion: PropTypes.boolean,
-  latestDraftVersion: PropTypes.boolean,
+  published: PropTypes.bool,
+  draft: PropTypes.bool,
+  deleted: PropTypes.bool,
+  liveVersion: PropTypes.bool,
+  latestDraftVersion: PropTypes.bool,
   publisher: memberShape,
   author: memberShape,
 });