Package updates.

client/package.json

@@ -3,11 +3,17 @@
   "version": "0.2.1",
   "private": true,
   "proxy": "http://localhost:4000",
+  "browser": {
+    "fs": false,
+    "path": false,
+    "os": false
+  },
   "dependencies": {
     "@apollo/client": "^3.5.10",
     "@asseinfo/react-kanban": "^2.2.0",
     "@craco/craco": "^6.4.3",
     "@fingerprintjs/fingerprintjs": "^3.3.3",
+    "@jsreport/browser-client": "^3.1.0",
     "@sentry/react": "^6.19.6",
     "@sentry/tracing": "^6.19.6",
     "@splitsoftware/splitio-react": "^1.4.0",
@@ -28,7 +34,6 @@
     "i18next": "^21.6.16",
     "i18next-browser-languagedetector": "^6.1.4",
     "jsoneditor": "^9.7.4",
-    "jsreport-browser-client-dist": "^1.3.0",
     "libphonenumber-js": "^1.9.51",
     "logrocket": "^2.2.1",
     "markerjs2": "^2.21.0",
@@ -53,8 +58,8 @@
     "react-number-format": "^4.9.1",
     "react-redux": "^7.2.8",
     "react-resizable": "^3.0.4",
-    "react-router-dom": "^6.3.0",
-    "react-scripts": "^5.0.1",
+    "react-router-dom": "^5.3.0",
+    "react-scripts": "^4.0.3",
     "react-sticky": "^6.0.3",
     "react-sublime-video": "^0.2.5",
     "react-virtualized": "^9.22.3",

client/src/index.js

@@ -3,7 +3,7 @@ import * as Sentry from "@sentry/react";
 import "antd/dist/antd.less";
 import Dinero from "dinero.js";
 import React from "react";
-import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
 import { Provider } from "react-redux";
 import { BrowserRouter } from "react-router-dom";
 import { PersistGate } from "redux-persist/integration/react";
@@ -39,7 +39,9 @@ if (process.env.NODE_ENV !== "development") {
   });
 }
 
-ReactDOM.render(
+const container = document.getElementById("root");
+const root = createRoot(container); // createRoot(container!) if you use TypeScript
+root.render(
   <Provider store={store}>
     <BrowserRouter>
       <PersistGate
@@ -49,48 +51,7 @@ ReactDOM.render(
         <AppContainer />
       </PersistGate>
     </BrowserRouter>
-  </Provider>,
-  document.getElementById("root")
+  </Provider>
 );
 
-// const onServiceWorkerUpdate = (registration) => {
-//   console.log("onServiceWorkerUpdate", registration);
-
-//   const btn = (
-//     <Space flex>
-//       <Button
-//         onClick={async () => {
-//           window.open("https://imex-online.noticeable.news/", "_blank");
-//         }}
-//       >
-//         {i18n.t("general.actions.viewreleasenotes")}
-//       </Button>
-//       <Button
-//         type="primary"
-//         onClick={async () => {
-//           if (registration && registration.waiting) {
-//             await registration.unregister();
-//             // Makes Workbox call skipWaiting()
-//             registration.waiting.postMessage({ type: "SKIP_WAITING" });
-//             // Once the service worker is unregistered, we can reload the page to let
-//             // the browser download a fresh copy of our app (invalidating the cache)
-//             window.location.reload();
-//           }
-//         }}
-//       >
-//         {i18n.t("general.actions.refresh")}
-//       </Button>
-//     </Space>
-//   );
-//   notification.open({
-//     icon: <AlertOutlined />,
-//     message: i18n.t("general.messages.newversiontitle"),
-//     description: i18n.t("general.messages.newversionmessage"),
-//     duration: 0,
-//     btn,
-//     key: "updateavailable",
-//   });
-// };
-
-// serviceWorkerRegistration.register({ onUpdate: onServiceWorkerUpdate });
 reportWebVitals();

client/src/utils/RenderTemplate.js

@@ -1,7 +1,7 @@
 import { gql } from "@apollo/client";
 import { notification } from "antd";
 import axios from "axios";
-import jsreport from "jsreport-browser-client-dist";
+import jsreport from "@jsreport/browser-client";
 import _ from "lodash";
 import moment from "moment";
 import { auth } from "../firebase/firebase.utils";