@nerdjs/sales-kit 2.2.11 → 2.3.0

package/dist/hooks/lep/lepWidget.js

@@ -1,37 +1,42 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Sheet, Tooltip, Typography, useColorScheme } from "@mui/joy";
-import { useEffect, useRef, useState } from "react";
+import { useContext, useEffect, useMemo, useRef, useState, } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
 import { lepWidgetIndexSelector } from "../../redux/lep/lepSelectors";
 import { setWidgetIndex } from "../../redux/lep/lepSlice";
 import { useSelector, useDispatch } from "react-redux";
+import { LoadIDContext } from "./loadEditPanel";
 /**
  *
  * @param {LoadWidgetProps} props LoadWidgetProps
  * @returns {React.ReactElement | null} LepWidget component
  */
 export function LepWidget(props) {
-    const { index } = props;
+    const id = useContext(LoadIDContext);
+    const { index, title, compareRoute } = props;
     const [focused, setFocused] = useState(false);
     const ref = useRef(null);
-    const widgetIndex = useSelector(lepWidgetIndexSelector);
+    const select = useMemo(() => (s) => lepWidgetIndexSelector(s, Number(id)), []);
+    const widgetIndex = useSelector(select);
     const dispatch = useDispatch();
     const { mode, systemMode } = useColorScheme();
     useHotkeys(`option+${index + 1}, alt+${index + 1}`, (e) => {
-        e.preventDefault();
-        if (ref && ref.current) {
-            ref.current.focus();
+        if (!compareRoute) {
+            e.preventDefault();
+            if (ref && ref.current) {
+                ref.current.focus();
+            }
         }
     }, { enableOnFormTags: ["INPUT", "SELECT", "TEXTAREA"] });
     useEffect(() => {
-        if (widgetIndex === index + 1) {
+        if (widgetIndex === index + 1 && !compareRoute) {
             if (ref && ref.current && !focused) {
                 ref.current.focus();
             }
         }
     }, [widgetIndex]);
     return (_jsxs(Sheet, { ref: ref, onFocus: () => {
-            dispatch(setWidgetIndex(index + 1));
+            dispatch(setWidgetIndex({ loadID: Number(id), index: index + 1 }));
             setFocused(true);
         }, onBlur: () => {
             setFocused(false);
@@ -39,7 +44,7 @@ export function LepWidget(props) {
             scrollMarginTop: "192px",
             position: "relative",
             outline: "none",
-            p: 1,
+            p: 0.5,
             height: "100%",
             border: focused
                 ? `2px solid ${mode === "dark" || (mode === "system" && systemMode === "dark")
@@ -56,12 +61,13 @@ export function LepWidget(props) {
             },
         }), children: [_jsx(Box, { sx: {
                     height: "100%",
-                }, children: props.children }), _jsx(Tooltip, { arrow: true, size: "sm", color: "neutral", variant: "outlined", title: "Keyboard Shortcut to focus", children: _jsx(Typography, { sx: {
-                        position: "absolute",
-                        bottom: "2px",
-                        right: "2px",
-                        fontSize: 9,
-                        backdropFilter: "blur(10px)",
-                    }, level: "body-xs", startDecorator: _jsx("i", { className: "fa-solid fa-option" }), children: index + 1 }) })] }));
+                }, children: props.children }), _jsxs(Box, { sx: {
+                    position: "absolute",
+                    display: "flex",
+                    bottom: "2px",
+                    right: "2px",
+                    fontSize: 9,
+                    backdropFilter: "blur(10px)",
+                }, children: [title, _jsx(Tooltip, { arrow: true, size: "sm", color: "neutral", variant: "outlined", title: "Keyboard Shortcut to focus", children: _jsx(Typography, { level: "body-xs", fontSize: "inherit", ml: 0.5, startDecorator: _jsx("i", { className: "fa-solid fa-option" }), children: index + 1 }) })] })] }));
 }
 //# sourceMappingURL=lepWidget.js.map

package/dist/hooks/lep/lepWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"lepWidget.js","sourceRoot":"","sources":["../../../src/hooks/lep/lepWidget.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"lepWidget.js","sourceRoot":"","sources":["../../../src/hooks/lep/lepWidget.tsx"],"names":[],"mappings":"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"}

package/dist/hooks/lep/lepWorkflowEvents.js

@@ -2,16 +2,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Box, Skeleton } from "@mui/joy";
 import { useGridApiRef, useKeepGroupedColumnsHidden, } from "@mui/x-data-grid-premium";
 import { DateTime } from "luxon";
-import { useCallback, useMemo } from "react";
-import { useParams } from "react-router-dom";
-import { LepStyledDataGrid } from "./lepStyledDataGrid";
+import { useCallback, useContext, useMemo } from "react";
 import { useGetLoadWorkflowEventsV1Query } from "../../redux";
+import { LepStyledDataGrid } from "./lepStyledDataGrid";
+import { LoadIDContext } from "./loadEditPanel";
 /**
  *
  * @returns {ReactElement} LepWorkflowEvents
  */
 export function LepWorkflowEvents() {
-    const { id } = useParams();
+    const id = useContext(LoadIDContext);
     const { isLoading } = useGetLoadWorkflowEventsV1Query({
         loadID: Number(id),
     }, { skip: Number.isNaN(Number(id)) });
@@ -24,7 +24,7 @@ export function LepWorkflowEvents() {
  * @returns {ReactElement} Content
  */
 function Content() {
-    const { id } = useParams();
+    const id = useContext(LoadIDContext);
     const apiRef = useGridApiRef();
     const { data: rows } = useGetLoadWorkflowEventsV1Query({
         loadID: Number(id),

package/dist/hooks/lep/lepWorkflowEvents.js.map

@@ -1 +1 @@
-{"version":3,"file":"lepWorkflowEvents.js","sourceRoot":"","sources":["../../../src/hooks/lep/lepWorkflowEvents.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAKL,aAAa,EACb,2BAA2B,GAC5B,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAgB,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,OAAO,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAE9D;;;GAGG;AACH,MAAM,UAAU,iBAAiB;IAC/B,MAAM,EAAE,EAAE,EAAE,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,EAAE,SAAS,EAAE,GAAG,+BAA+B,CACnD;QACE,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC;KACnB,EACD,EAAE,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CACnC,CAAC;IACF,IAAI,SAAS;QACX,OAAO,KAAC,QAAQ,IAAC,OAAO,EAAC,aAAa,EAAC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,GAAI,CAAC;IACxE,OAAO,KAAC,OAAO,KAAG,CAAC;AACrB,CAAC;AAED;;;GAGG;AACH,SAAS,OAAO;IACd,MAAM,EAAE,EAAE,EAAE,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,MAAM,GAAG,aAAa,EAAE,CAAC;IAC/B,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,+BAA+B,CACpD;QACE,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC;KACnB,EACD,EAAE,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CACnC,CAAC;IACF,MAAM,OAAO,GAAiB,OAAO,CACnC,GAAG,EAAE,CAAC;QACJ,EAAE,KAAK,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,EAAE;QACjD;YACE,KAAK,EAAE,YAAY;YACnB,UAAU,EAAE,MAAM;YAClB,IAAI,EAAE,CAAC;YACP,UAAU,CAAC,MAA0D;gBACnE,OAAO,MAAM,CAAC,KAAK;oBACjB,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC;yBAC3B,KAAK,EAAE;yBACP,QAAQ,CAAC,kBAAkB,CAAC;oBACjC,CAAC,CAAC,EAAE,CAAC;YACT,CAAC;SACF;QACD;YACE,KAAK,EAAE,mBAAmB;YAC1B,UAAU,EAAE,QAAQ;YACpB,IAAI,EAAE,CAAC;SACR;QACD;YACE,KAAK,EAAE,aAAa;YACpB,UAAU,EAAE,aAAa;YACzB,IAAI,EAAE,CAAC;SACR;QACD;YACE,KAAK,EAAE,kBAAkB;YACzB,UAAU,EAAE,MAAM;YAClB,IAAI,EAAE,CAAC;SACR;QACD;YACE,KAAK,EAAE,eAAe;YACtB,UAAU,EAAE,eAAe;YAC3B,IAAI,EAAE,CAAC;SACR;KACF,EACD,EAAE,CACH,CAAC;IAEF,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,MAAqB,EAAE,EAAE;QACxB,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACrD,IAAI,OAAO,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE;YACvC,MAAM,CAAC,OAAO,CAAC,uBAAuB,CACpC,MAAM,CAAC,EAAE,EACT,CAAC,OAAO,CAAC,gBAAgB,CAC1B,CAAC;SACH;IACH,CAAC,EACD,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,MAAM,YAAY,GAAG,2BAA2B,CAAC;QAC/C,MAAM;QACN,YAAY,EAAE;YACZ,WAAW,EAAE;gBACX,KAAK,EAAE,CAAC,kBAAkB,CAAC;aAC5B;SACF;KACF,CAAC,CAAC;IAEH,OAAO,CACL,KAAC,GAAG,IAAC,MAAM,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YACtD,KAAC,iBAAiB,IAChB,MAAM,EAAE,MAAM,EACd,OAAO,EAAC,SAAS,EACjB,UAAU,QACV,IAAI,EAAE,IAAI,IAAI,EAAE,EAChB,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE;gBACd,IAAI,EAAE,CAAC;aACR,EACD,0BAA0B,QAC1B,UAAU,EAAE,UAAU,EACtB,6BAA6B,EAAE,CAAC,GAChC,GACE,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"lepWorkflowEvents.js","sourceRoot":"","sources":["../../../src/hooks/lep/lepWorkflowEvents.tsx"],"names":[],"mappings":"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"}

package/dist/hooks/lep/loadEditPanel.d.ts

@@ -1,6 +1,24 @@
 import { ReactElement } from "react";
+export declare const LoadIDContext: import("react").Context<string>;
+export interface Widget {
+    id: number;
+    title: string;
+    organism?: any;
+    size?: {
+        xs?: number;
+        sm?: number;
+        md?: number;
+        lg?: number;
+        xl?: number;
+    };
+}
 /**
  *
+ * @param root0
+ * @param root0.quoteRoute
+ * @param root0.loadsRoute
+ * @param root0.backTo
+ * @param root0.mapID
  * @returns {ReactElement} LoadEditPanel
  */
 export declare function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }: {
@@ -9,3 +27,7 @@ export declare function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }
     backTo?: string;
     mapID?: string;
 }): ReactElement;
+export declare const tabs: {
+    label: string;
+    widgets: Widget[];
+}[];

package/dist/hooks/lep/loadEditPanel.js

@@ -1,31 +1,38 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from "react";
+import { Box, Button, CircularProgress, DialogActions, DialogContent, Grid, IconButton, Modal, ModalDialog, Sheet, Tab, TabList, TabPanel, Tabs, Tooltip, Typography, tabClasses, useTheme, } from "@mui/joy";
+import { useMediaQuery } from "@mui/system";
+import { NerdDraggableDialog } from "@nerdjs/nerd-ui";
+import { nanoid } from "@reduxjs/toolkit";
+import { createContext, useCallback, useContext, useEffect, useState, } from "react";
 import { useHotkeys } from "react-hotkeys-hook";
-import { useNavigate, useParams } from "react-router-dom";
-import { Box, Grid, Sheet, Tab, TabList, TabPanel, Tabs, tabClasses, CircularProgress, IconButton, Tooltip, useTheme, Modal, ModalDialog, DialogContent, DialogActions, Button, Typography, } from "@mui/joy";
-import { decreaseWidgetIndex, increaseWidgetIndex, setLepStagedDocuments, setLepTabIndex, setWidgetIndex, } from "../../redux/lep/lepSlice";
-import { lepStagedDocumentsSelector, lepTabIndexSelector, lepWidgetIndexSelector, } from "../../redux/lep/lepSelectors";
-import { checkFields, LepAccessorials, LepActionBar, LepAdjustments, LepAppointmentArrival, LepClaims, LepCommodities, LepConsolidations, LepCustomerContacts, LepCustomerInfo, LepCustomerPeople, LepCustomersAccessorials, LepCustomerSalesNotes, LepDispatches, LepDocuments, LepEDI, LepHosLogs, LepInvoiceAdjustments, LepInvoiceDetails, LepInvoiceLineItems, LepKickbacks, LepLoadChanges, LepLoadInfo, LepLoadLocation, LepLoadNotes, LepNotifications, LepPossibleIssues, LepQuoteResult, LepRateLogs, LepRateReviews, LepShipcons, LepTendersWidget, LepUserNotes, LepWorkflowEvents, LepWidget, } from "./index";
+import { useTranslation } from "react-i18next";
+import { useDispatch, useSelector } from "react-redux";
+import { Link, useNavigate } from "react-router-dom";
+import salesKitI18n from "../../i18n";
 import { setSelectedDate, setSelectedServiceLevel, useGetLoadQuery, useGetLoadRateReviewsV1Query, } from "../../redux";
+import { lepStagedDocumentsSelector, lepTabIndexSelector, lepWidgetIndexSelector, } from "../../redux/lep/lepSelectors";
+import { decreaseWidgetIndex, increaseWidgetIndex, setLepStagedDocuments, setLepTabIndex, setWidgetIndex, } from "../../redux/lep/lepSlice";
 import { addLoadInfoTask, removeLoadInfoTask, } from "../../redux/loadInfoTasksSlice/loadInfoTasksSlice";
-import { nanoid } from "@reduxjs/toolkit";
-import salesKitI18n from "../../i18n";
-import { useTranslation } from "react-i18next";
-import { useMediaQuery } from "@mui/system";
-import { setRecalculateBody } from "../../redux/quote";
-import { NerdDraggableDialog } from "@nerdjs/nerd-ui";
-import { Link } from "react-router-dom";
-import { useSelector, useDispatch } from "react-redux";
+import { quoteRecalculateBodySelector, setRecalculateBody, } from "../../redux/quote";
+import { LepAccessorials, LepActionBar, LepAdjustments, LepAppointmentArrival, LepClaims, LepCommodities, LepConsolidations, LepCustomerContacts, LepCustomerInfo, LepCustomerPeople, LepCustomerSalesNotes, LepCustomersAccessorials, LepDispatches, LepDocuments, LepEDI, LepHosLogs, LepInvoiceAdjustments, LepInvoiceDetails, LepInvoiceLineItems, LepKickbacks, LepLoadChanges, LepLoadInfo, LepLoadLocation, LepLoadNotes, LepNotifications, LepPossibleIssues, LepQuoteResult, LepRateLogs, LepRateReviews, LepShipcons, LepTendersWidget, LepUserNotes, LepWidget, LepWorkflowEvents, checkFields, } from "./index";
+import { LepLoadSummary } from "./lepLoadSummary";
+export const LoadIDContext = createContext("");
 /**
  *
+ * @param root0
+ * @param root0.quoteRoute
+ * @param root0.loadsRoute
+ * @param root0.backTo
+ * @param root0.mapID
  * @returns {ReactElement} LoadEditPanel
  */
 export function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }) {
     const { t } = useTranslation("common", { i18n: salesKitI18n });
-    const tabIndex = useSelector(lepTabIndexSelector);
     const navigate = useNavigate();
-    const { id } = useParams();
-    const widgetIndex = useSelector(lepWidgetIndexSelector);
+    const id = useContext(LoadIDContext);
+    const tabIndex = useSelector((s) => lepTabIndexSelector(s, Number(id)));
+    const recalculateBody = useSelector(quoteRecalculateBodySelector(Number(id)));
+    const widgetIndex = useSelector((s) => lepWidgetIndexSelector(s, Number(id)));
     const dispatch = useDispatch();
     const { data: rateReviews } = useGetLoadRateReviewsV1Query(Number(id), {
         skip: Number.isNaN(Number(id)),
@@ -34,11 +41,11 @@ export function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }) {
         skip: Number.isNaN(Number(id)),
     });
     const [iframeLoading, setIframeLoading] = useState(true);
-    const stagedDocuments = useSelector(lepStagedDocumentsSelector);
+    const stagedDocuments = useSelector((s) => lepStagedDocumentsSelector(s, Number(id)));
     const theme = useTheme();
     const upSM = useMediaQuery(theme.breakpoints.up("sm"));
     const handleClose = useCallback(() => {
-        dispatch(setLepStagedDocuments(undefined));
+        dispatch(setLepStagedDocuments({ loadID: Number(id), docs: undefined }));
         setIframeLoading(true);
     }, [stagedDocuments]);
     useEffect(() => {
@@ -50,93 +57,100 @@ export function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }) {
                 replace: true,
             });
             dispatch(setRecalculateBody({
-                quote_id: load.quoteID,
-                load_id: load.id,
-                reefer_temp: load.reeferTemp,
-                reefer_cont: load.reeferCont,
-                date_received: load.receivedDate,
-                reference_number: load.referenceNumber,
-                load_type: load.loadType,
-                cargo_value: load.cargoValue,
-                notes: load.notes,
-                customer_miles: load.customerMiles,
-                customer_id: load.customerID,
-                do_not_break_seal: load.doNotBreakSeal,
-                disable_rounding: load.disableRounding,
-                force_spot: load.forceSpot,
-                local_move: load.localMove,
-                no_split: load.noSplit,
-                otr_pickup: load.otrPickup,
-                service_level: load.serviceLevel,
-                booked_by_id: load.bookedByID,
-                person_ids: load.person_ids,
-                dryvan_only: load.dryvanOnly,
-                load_preferred_carrier_type: load.loadPreferredCarrierType,
-                nmfc_class_id: load.nmfcClassID,
-                seal: load.seal,
+                id: load.id,
+                body: {
+                    quote_id: load.quoteID,
+                    load_id: load.id,
+                    reefer_temp: load.reeferTemp,
+                    reefer_cont: load.reeferCont,
+                    date_received: load.receivedDate,
+                    reference_number: load.referenceNumber,
+                    load_type: load.loadType,
+                    cargo_value: load.cargoValue,
+                    notes: load.notes,
+                    customer_miles: load.customerMiles,
+                    customer_id: load.customerID,
+                    do_not_break_seal: load.doNotBreakSeal,
+                    disable_rounding: load.disableRounding,
+                    force_spot: load.forceSpot,
+                    local_move: load.localMove,
+                    no_split: load.noSplit,
+                    otr_pickup: load.otrPickup,
+                    service_level: load.serviceLevel,
+                    booked_by_id: load.bookedByID,
+                    person_ids: load.person_ids,
+                    dryvan_only: load.dryvanOnly,
+                    load_preferred_carrier_type: load.loadPreferredCarrierType,
+                    nmfc_class_id: load.nmfcClassID,
+                    seal: load.seal,
+                },
             }));
             checkFields(load, dispatch);
         }
     }, [load?.id]);
     useEffect(() => {
-        if (load?.rateType === "Spot") {
-            dispatch(removeLoadInfoTask("forceSpot"));
-            if (rateReviews && rateReviews.length === 0) {
-                const label = "No Rate Review record for load. Please upload a Rate Confirmation and create a Rate Review.";
-                dispatch(addLoadInfoTask({
-                    field: "rateReview",
-                    task: {
-                        label: label,
-                        status: "danger",
-                        uuid: nanoid(),
-                        step: {
-                            content: label,
-                            selector: ".LepPanelRoot",
-                            mutationObservables: [".LoadInfoTaskItem-rateReview"],
-                            highlightedSelectors: [".LoadInfoTaskItem-rateReview"],
+        if (load?.id)
+            if (load?.rateType === "Spot") {
+                dispatch(removeLoadInfoTask({ loadID: load.id, field: "forceSpot" }));
+                if (rateReviews && rateReviews.length === 0) {
+                    const label = "No Rate Review record for load. Please upload a Rate Confirmation and create a Rate Review.";
+                    dispatch(addLoadInfoTask({
+                        loadID: load.id,
+                        field: "rateReview",
+                        task: {
+                            label: label,
+                            status: "danger",
+                            uuid: nanoid(),
+                            step: {
+                                content: label,
+                                selector: ".LepPanelRoot",
+                                mutationObservables: [".LoadInfoTaskItem-rateReview"],
+                                highlightedSelectors: [".LoadInfoTaskItem-rateReview"],
+                            },
+                            order: 8,
+                            tabIndex: 2,
                         },
-                        order: 8,
-                        tabIndex: 2,
-                    },
-                }));
-            }
-            else {
-                dispatch(addLoadInfoTask({
-                    field: "rateReview",
-                    task: {
-                        label: "Rate review created.",
-                        status: "success",
-                        uuid: nanoid(),
-                        order: 8,
-                    },
-                }));
-            }
-        }
-        else if (load?.contractCustomer) {
-            dispatch(removeLoadInfoTask("rateReview"));
-            if (!load.forceSpot && !load?.contractRateRecordID) {
-                const label = "No contract rate found for lane, please 'Force Spot' and recaculate.";
-                dispatch(addLoadInfoTask({
-                    field: "forceSpot",
-                    task: {
-                        label: label,
-                        status: "danger",
-                        uuid: nanoid(),
-                        step: {
-                            content: label,
-                            selector: ".LepPanelRoot",
-                            mutationObservables: [".LoadInfoTaskItem-forceSpot"],
-                            highlightedSelectors: [".LoadInfoTaskItem-forceSpot"],
+                    }));
+                }
+                else {
+                    dispatch(addLoadInfoTask({
+                        loadID: load.id,
+                        field: "rateReview",
+                        task: {
+                            label: "Rate review created.",
+                            status: "success",
+                            uuid: nanoid(),
+                            order: 8,
                         },
-                        order: 6,
-                        tabIndex: 0,
-                    },
-                }));
+                    }));
+                }
             }
-            else {
-                dispatch(removeLoadInfoTask("forceSpot"));
+            else if (load?.contractCustomer) {
+                dispatch(removeLoadInfoTask({ loadID: load.id, field: "rateReview" }));
+                if (!load.forceSpot && !load?.contractRateRecordID) {
+                    const label = "No contract rate found for lane, please 'Force Spot' and recaculate.";
+                    dispatch(addLoadInfoTask({
+                        loadID: load.id,
+                        field: "forceSpot",
+                        task: {
+                            label: label,
+                            status: "danger",
+                            uuid: nanoid(),
+                            step: {
+                                content: label,
+                                selector: ".LepPanelRoot",
+                                mutationObservables: [".LoadInfoTaskItem-forceSpot"],
+                                highlightedSelectors: [".LoadInfoTaskItem-forceSpot"],
+                            },
+                            order: 6,
+                            tabIndex: 0,
+                        },
+                    }));
+                }
+                else {
+                    dispatch(removeLoadInfoTask({ loadID: load.id, field: "forceSpot" }));
+                }
             }
-        }
     }, [rateReviews, load]);
     useEffect(() => {
         if (!id)
@@ -145,67 +159,67 @@ export function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }) {
     useHotkeys(`option+left, alt+left`, (e) => {
         e.preventDefault();
         if (tabIndex > 0) {
-            dispatch(setWidgetIndex(0));
-            dispatch(setLepTabIndex(tabIndex - 1));
+            dispatch(setWidgetIndex({ loadID: Number(id), index: 0 }));
+            dispatch(setLepTabIndex({ loadID: Number(id), index: tabIndex - 1 }));
         }
     }, { enableOnFormTags: ["INPUT", "SELECT", "TEXTAREA"] });
     useHotkeys(`option+right, alt+right`, (e) => {
         e.preventDefault();
         if (tabIndex < tabs.length - 1) {
-            dispatch(setWidgetIndex(0));
-            dispatch(setLepTabIndex(tabIndex + 1));
+            dispatch(setWidgetIndex({ loadID: Number(id), index: 0 }));
+            dispatch(setLepTabIndex({ loadID: Number(id), index: tabIndex + 1 }));
         }
     }, { enableOnFormTags: ["INPUT", "SELECT", "TEXTAREA"] });
     useHotkeys(`option+down, alt+down`, (e) => {
         e.preventDefault();
         if (widgetIndex < tabs[tabIndex].widgets.length)
-            dispatch(increaseWidgetIndex());
+            dispatch(increaseWidgetIndex(Number(id)));
     }, { enableOnFormTags: ["INPUT", "SELECT", "TEXTAREA"] });
     useHotkeys(`option+up, alt+up`, (e) => {
         e.preventDefault();
         if (widgetIndex > 1)
-            dispatch(decreaseWidgetIndex());
+            dispatch(decreaseWidgetIndex(Number(id)));
     }, { enableOnFormTags: ["INPUT", "SELECT", "TEXTAREA"] });
     useEffect(() => {
-        dispatch(setLepStagedDocuments(undefined));
+        dispatch(setLepStagedDocuments({ loadID: Number(id), docs: undefined }));
         dispatch(setSelectedDate(null));
         dispatch(setSelectedServiceLevel(undefined));
     }, [id]);
-    if (!id) {
+    if (!id || !recalculateBody) {
         return _jsx(_Fragment, {});
     }
     return (_jsxs(Box, { children: [_jsxs(Tabs, { value: tabIndex, onChange: (_e, v) => {
-                    dispatch(setWidgetIndex(0));
-                    setTimeout(() => dispatch(setLepTabIndex(v)), 50);
+                    dispatch(setWidgetIndex({ loadID: Number(id), index: 0 }));
+                    setTimeout(() => dispatch(setLepTabIndex({ loadID: Number(id), index: v })), 50);
                 }, sx: {
                     width: "100%",
                     bgcolor: "transparent",
-                }, children: [_jsx(Box, { position: "sticky", top: 98, zIndex: 1201, sx: {
+                }, children: [_jsxs(Box, { position: "sticky", top: 98, zIndex: 1201, sx: {
                             borderBottom: "1px solid lightgrey",
-                        }, children: _jsx(Sheet, { children: _jsx(Box, { sx: { pl: 1, pr: 1, pt: 0.25, pb: 0.25 }, children: _jsx(LepActionBar, { onDuplicateLoad: (id) => navigate(`${loadsRoute}/${id}`), backTo: backTo, children: _jsx(TabList, { size: "sm", disableUnderline: true, sx: {
-                                            zIndex: (t) => t.zIndex.popup,
-                                            overflow: "auto",
-                                            scrollSnapType: "x mandatory",
-                                            "&::-webkit-scrollbar": { display: "none" },
-                                            p: 0.5,
-                                            gap: 0.5,
-                                            borderRadius: "xl",
-                                            bgcolor: "background.level1",
-                                            [`& .${tabClasses.root}[aria-selected="true"]`]: {
-                                                boxShadow: "sm",
-                                                bgcolor: "background.surface",
-                                            },
-                                            [`& .${tabClasses.root}`]: {
-                                                pt: 0.3,
-                                                pb: 0.3,
-                                                pl: 1,
-                                                pr: 1,
-                                            },
-                                        }, children: tabs.map((t, i) => (_jsx(Tab, { disableIndicator: true, variant: "plain", color: tabIndex === i ? "primary" : "neutral", sx: { flex: "none", scrollSnapAlign: "start" }, children: t.label }, i))) }) }) }) }) }), tabs.map((_tab, i) => (_jsx(TabPanel, { value: i, sx: {
+                        }, children: [_jsx(Sheet, { children: _jsx(Box, { sx: { pl: 1, pr: 1, pt: 0.25, pb: 0.25 }, children: _jsx(LepActionBar, { onDuplicateLoad: (id) => navigate(`${loadsRoute}/${id}`), backTo: backTo, children: _jsx(TabList, { size: "sm", disableUnderline: true, sx: {
+                                                zIndex: (t) => t.zIndex.popup,
+                                                overflow: "auto",
+                                                scrollSnapType: "x mandatory",
+                                                "&::-webkit-scrollbar": { display: "none" },
+                                                p: 0.5,
+                                                gap: 0.5,
+                                                borderRadius: "xl",
+                                                bgcolor: "background.level1",
+                                                [`& .${tabClasses.root}[aria-selected="true"]`]: {
+                                                    boxShadow: "sm",
+                                                    bgcolor: "background.surface",
+                                                },
+                                                [`& .${tabClasses.root}`]: {
+                                                    pt: 0.3,
+                                                    pb: 0.3,
+                                                    pl: 1,
+                                                    pr: 1,
+                                                },
+                                            }, children: tabs.map((t, i) => (_jsx(Tab, { disableIndicator: true, variant: "plain", color: tabIndex === i ? "primary" : "neutral", sx: { flex: "none", scrollSnapAlign: "start" }, children: t.label }, i))) }) }) }) }), _jsx(LepLoadSummary, {})] }), tabs.map((_tab, i) => (_jsx(TabPanel, { value: i, sx: {
                             p: 0,
                             display: tabIndex === i ? "flex" : "none",
                             justifyContent: "center",
-                        }, children: _jsx(Grid, { p: 1, container: true, spacing: 1, maxWidth: 1920, width: "100%", children: tabs[tabIndex].widgets.map((w, i) => (_jsx(Grid, { ...w.size, children: _jsx(LepWidget, { title: w.title, index: Number(i), children: w.organism ? (_jsx(w.organism, { quoteRoute: quoteRoute, mapID: mapID })) : (_jsx("div", {})) }) }, w.id))) }) }, i)))] }), stagedDocuments && upSM
+                        }, children: _jsx(Grid, { p: 1, container: true, spacing: 1, maxWidth: 1920, width: "100%", children: tabs[tabIndex].widgets.map((w, i) => (_jsx(Grid, { ...w.size, children: _jsx(LepWidget, { title: w.title, index: Number(i), compareRoute: false, children: w.organism ? (_jsx(w.organism, { quoteRoute: quoteRoute, mapID: mapID })) : (_jsx("div", {})) }) }, w.id))) }) }, i)))] }), stagedDocuments && upSM
                 ? stagedDocuments.map((d) => _jsx(Document, { d: d }, d.uuid))
                 : null, stagedDocuments && !upSM ? (_jsx(Modal, { open: Boolean(stagedDocuments[0]), onClose: () => handleClose(), children: _jsxs(ModalDialog, { layout: "fullscreen", children: [_jsxs(DialogContent, { sx: {
                                 height: "100%",
@@ -216,7 +230,7 @@ export function LoadEditPanel({ quoteRoute, loadsRoute, mapID, backTo, }) {
                                         width: "100%",
                                     }, src: `${window._APP_CONFIG?.api?.endpoint}/v3/file-service/files/${stagedDocuments[0]?.documentID}?inline=1`, onLoad: () => setIframeLoading(false) })] }), _jsxs(DialogActions, { children: [_jsx(Button, { variant: "soft", color: "neutral", onClick: () => handleClose(), children: t("Close") }), _jsx(Button, { variant: "soft", color: "neutral", component: Link, to: `${window._APP_CONFIG?.api?.endpoint}/v3/file-service/files/${stagedDocuments[0]?.documentID}?inline=0`, target: "_blank", startDecorator: _jsx("i", { className: "fa-solid fa-arrow-up-right-from-square" }), children: "Open" })] })] }) })) : null] }));
 }
-const tabs = [
+export const tabs = [
     {
         label: "Load",
         widgets: [
@@ -234,7 +248,6 @@ const tabs = [
                 organism: LepLoadInfo,
                 size: {
                     xs: 12,
-                    md: 6,
                 },
             },
             {
@@ -243,7 +256,7 @@ const tabs = [
                 organism: LepAdjustments,
                 size: {
                     xs: 12,
-                    md: 6,
+                    lg: 4.5,
                 },
             },
             {
@@ -252,6 +265,7 @@ const tabs = [
                 organism: LepAccessorials,
                 size: {
                     xs: 12,
+                    lg: 7.5,
                 },
             },
             {
@@ -520,13 +534,13 @@ const tabs = [
                     xs: 12,
                 },
             },
+            { id: 2, title: "Kickbacks", organism: LepKickbacks, size: { xs: 12 } },
             {
-                id: 2,
+                id: 3,
                 title: "Invoice Line Items",
                 organism: LepInvoiceLineItems,
-                size: { xs: 12 },
+                size: { xs: 6 },
             },
-            { id: 3, title: "Kickbacks", organism: LepKickbacks, size: { xs: 6 } },
             {
                 id: 4,
                 title: "Invoice Adjustments",
@@ -538,13 +552,17 @@ const tabs = [
 ];
 const Document = ({ d }) => {
     const { t } = useTranslation("common", { i18n: salesKitI18n });
+    const id = useContext(LoadIDContext);
     const [iframeLoading, setIframeLoading] = useState(true);
     const dispatch = useDispatch();
-    const stagedDocuments = useSelector(lepStagedDocumentsSelector);
+    const stagedDocuments = useSelector((s) => lepStagedDocumentsSelector(s, Number(id)));
     const handleClose = useCallback((uuid) => {
-        dispatch(setLepStagedDocuments(stagedDocuments
-            ? [...stagedDocuments.filter((i) => i.uuid !== uuid)]
-            : []));
+        dispatch(setLepStagedDocuments({
+            loadID: Number(id),
+            docs: stagedDocuments
+                ? [...stagedDocuments.filter((i) => i.uuid !== uuid)]
+                : [],
+        }));
     }, [stagedDocuments]);
     return (_jsx(NerdDraggableDialog, { draggableProps: {
             handle: "#draggable-area",