@carbonorm/carbonreact 3.4.7 → 3.5.0

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import react, { useRef, useState, useEffect, Component, lazy } from 'react';
 import { toastOptions, clearCache, timeout, axiosInstance, isVerbose, checkAllRequestsComplete } from '@carbonorm/carbonnode';
-import { useNavigate, BrowserRouter } from 'react-router-dom';
+import { useNavigate } from 'react-router-dom';
 import { toast, ToastContainer } from 'react-toastify';
 import OutsideClickHandler from 'react-outside-click-handler';
 import classNames from 'classnames';
@@ -3896,12 +3896,8 @@ function getStyles(overrides = {}) {
 
 // @link https://stackoverflow.com/questions/58399637/include-modal-functionality-in-react-higher-order-component
 function Popup({ open = true, handleClose, children, maxWidth, }) {
-    if (false === open) {
-        // @link https://legacy.reactjs.org/docs/conditional-rendering.html#preventing-component-from-rendering
-        return jsxRuntime_1(jsxRuntime_3, {});
-    }
     const dig = getStyles();
-    return jsxRuntime_1("div", { className: classNames(dig.modal, dig.fade, dig.show, dig.dBlock), style: { backgroundColor: "rgba(0,0,0,0.8)" }, id: "exampleModalCenter", tabIndex: -1, "aria-labelledby": "exampleModalCenterTitle", "aria-modal": "true", role: "dialog", children: jsxRuntime_1("div", { style: { maxWidth: maxWidth }, className: classNames(dig.modalDialog, dig.modalDialogCentered), children: jsxRuntime_1(OutsideClickHandler, { onOutsideClick: () => handleClose(), children: jsxRuntime_1("div", { className: classNames(dig.modalContent, dig.bgTransparent, dig.modalDialogScrollable), children: children }) }) }) });
+    return jsxRuntime_1("div", { className: classNames(dig.modal, dig.fade, { [dig.show]: open }, dig.dBlock), style: { backgroundColor: "rgba(0,0,0,0.8)" }, id: "exampleModalCenter", tabIndex: -1, "aria-labelledby": "exampleModalCenterTitle", "aria-modal": "true", role: "dialog", children: jsxRuntime_1("div", { style: { maxWidth: maxWidth }, className: classNames(dig.modalDialog, dig.modalDialogCentered), children: jsxRuntime_1(OutsideClickHandler, { onOutsideClick: () => handleClose(), children: jsxRuntime_1("div", { className: classNames(dig.modalContent, dig.bgTransparent, dig.modalDialogScrollable), children: children }) }) }) });
 }
 
 const isProduction = window.location.host.split(".")[0] === "www";
@@ -4047,7 +4043,7 @@ const useEffectOnce = (effect) => {
  * @function connect
  * This function establishes a connection with the websocket and also ensures constant reconnection if connection closes
  **/
-function initiateWebsocket({ TABLES = undefined, url = 'ws://localhost:8080/ws', timeoutSeconds = 250, heartbeatSeconds = 60 } = {}) {
+function initiateWebsocket({ TABLES = undefined, WsLiveUpdates = undefined, url = 'ws://localhost:8080/ws', timeoutSeconds = 250, heartbeatSeconds = 60 } = {}) {
     const { websocket } = CarbonReact.instance.state;
     if (!("WebSocket" in window)) {
         // todo - store that this has been shown in the state
@@ -4082,17 +4078,59 @@ function initiateWebsocket({ TABLES = undefined, url = 'ws://localhost:8080/ws',
         };
         connection.onmessage = (message) => {
             const parsedData = isJsonString(message?.data) ? JSON.parse(message?.data) : message?.data;
+            if (message.data === 'pong') {
+                return;
+            }
             CarbonReact.instance.setState((prevState) => ({
                 websocketEvents: prevState.websocketEvents.concat(message),
                 websocketData: prevState.websocketData.concat(parsedData), // JSON.parse no good - base64?
-            }));
-            console.info('todo - going to impl TABLES', TABLES);
-            /*if (undefined !== TABLES) {
-
-                TABLES.
-
-
-            }*/
+            }), () => {
+                if (undefined === TABLES) {
+                    console.log('WebSocket updates without the TABLES property passed will not automatically update the state.');
+                    return;
+                }
+                if (undefined === WsLiveUpdates) {
+                    console.log('WebSocket updates without the WsLiveUpdates property passed will not automatically update the state.');
+                    return;
+                }
+                if (parsedData?.REST) {
+                    const TABLE_NAME = parsedData?.REST?.TABLE_NAME;
+                    const TABLE_PREFIX = parsedData?.REST?.TABLE_PREFIX;
+                    const METHOD = parsedData?.REST?.METHOD;
+                    const REQUEST = parsedData?.REST?.REQUEST;
+                    const REQUEST_PRIMARY_KEY = parsedData?.REST?.REQUEST_PRIMARY_KEY ?? null;
+                    if (null === REQUEST_PRIMARY_KEY) {
+                        console.log('WebSocket updates without a primary key are not yet supported.');
+                        return;
+                    }
+                    console.log('todo - going to impl REST', TABLE_NAME, METHOD, REQUEST_PRIMARY_KEY, parsedData?.REST);
+                    const TABLE_NAME_SHORT = TABLE_NAME.substring(TABLE_PREFIX.length);
+                    const currentCache = CarbonReact.instance.state[TABLE_NAME_SHORT];
+                    // just because we have a websocket update, doesn't mean we need the update
+                    // check to see if the primary key is in the current cache
+                    const c6Table = TABLES[TABLE_NAME_SHORT] ?? null;
+                    if (null === c6Table) {
+                        console.error('WebSocket update could not find (' + TABLE_NAME_SHORT + ') in the TABLES property passed.', TABLES);
+                        return;
+                    }
+                    const primaryKeyKeys = Object.keys(REQUEST_PRIMARY_KEY);
+                    const elementsToUpdate = currentCache.filter((row) => {
+                        for (const element of primaryKeyKeys) {
+                            if (REQUEST_PRIMARY_KEY[element] !== row[element]) {
+                                return false;
+                            }
+                        }
+                        return true;
+                    });
+                    const updatedElements = elementsToUpdate.map((row) => {
+                        return {
+                            ...row,
+                            ...REQUEST
+                        };
+                    });
+                    WsLiveUpdates[TABLE_NAME_SHORT][METHOD]({}, updatedElements);
+                }
+            });
         };
         window.addEventListener("focus", () => initiateWebsocket());
         // websocket onclose event listener
@@ -4189,16 +4227,19 @@ function isJsonString(str) {
 }
 const CarbonReact = class extends Component {
     static instance;
+    static persistentState = undefined;
     static lastLocation = window.location.pathname;
-    static websocketUrl = (window.location.protocol === 'https:' ? 'wss://' : 'ws://') + window.location.host + ':8888/ws';
-    static websocketTimeoutSeconds = 250;
-    static websocketHeartbeatSeconds = 250;
     // @link https://github.com/welldone-software/why-did-you-render
     // noinspection JSUnusedGlobalSymbols
     static whyDidYouRender = true;
     constructor(props) {
         super(props);
-        this.state = initialCarbonReactState;
+        if (CarbonReact.persistentState !== undefined && this.props.shouldStatePersist !== false) {
+            this.state = CarbonReact.persistentState;
+        }
+        else {
+            this.state = initialCarbonReactState;
+        }
         // This should only ever be done here, when the full state is being trashed.
         clearCache({
             ignoreWarning: true
@@ -4214,6 +4255,12 @@ const CarbonReact = class extends Component {
         return CarbonReact.instance.state;
     }
     shouldComponentUpdate(nextProps, nextState, _nextContext) {
+        if (this.props.shouldStatePersist === false) {
+            CarbonReact.persistentState = undefined;
+        }
+        else {
+            CarbonReact.persistentState = nextState;
+        }
         changed(this.constructor.name + ' (DigApi)', 'props', this.props, nextProps);
         changed(this.constructor.name + ' (DigApi)', 'state', this.state, nextState);
         return true;
@@ -4236,7 +4283,7 @@ const CarbonReact = class extends Component {
         if (this.state.backendThrowable.length > 0) {
             return jsxRuntime_2(jsxRuntime_3, { children: [nest, jsxRuntime_1(BackendThrowable, {})] });
         }
-        return jsxRuntime_2(BrowserRouter, { children: [jsxRuntime_1(GlobalHistory, {}), jsxRuntime_1(CarbonWebSocket, {}), this.props.children, jsxRuntime_1(ToastContainer, {})] });
+        return jsxRuntime_2(jsxRuntime_3, { children: [jsxRuntime_1(GlobalHistory, {}), jsxRuntime_1(CarbonWebSocket, {}), this.props.children, jsxRuntime_1(ToastContainer, {})] });
     }
 };