IO-2932-Scheduling-Lag-on-AIO:

Bump React-Big-Calendar

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/job-at-change/schedule-event.component.jsx

@@ -2,11 +2,10 @@ import { AlertFilled } from "@ant-design/icons";
 import { Button, Divider, Dropdown, Form, Input, notification, Popover, Select, Space } from "antd";
 import parsePhoneNumber from "libphonenumber-js";
 import dayjs from "../../utils/day";
-import queryString from "query-string";
-import React, { useState, useCallback, useMemo } from "react";
+import React, { useCallback, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
-import { Link, useLocation, useNavigate } from "react-router-dom";
+import { Link, useNavigate, useSearchParams } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import { openChatByPhone, setMessage } from "../../redux/messaging/messaging.actions";
 import { setModalContext } from "../../redux/modals/modals.actions";
@@ -46,8 +45,8 @@ export function ScheduleEventComponent({
   const { t } = useTranslation();
   const [open, setOpen] = useState(false);
   const navigate = useNavigate();
-  const location = useLocation();
-  const searchParams = queryString.parse(location.search);
+  const [searchParams] = useSearchParams();
+
   const [updateAppointment] = useMutation(UPDATE_APPOINTMENT);
   const [title, setTitle] = useState(event.title);
 
@@ -79,12 +78,9 @@ export function ScheduleEventComponent({
   }, [handleCancel, event.id]);
 
   const handlePreviewClick = useCallback(() => {
-    navigate({
-      search: queryString.stringify({
-        ...searchParams,
-        selected: event.job.id
-      })
-    });
+    const params = new URLSearchParams(searchParams);
+    params.set("selected", event.job?.id);
+    navigate({ search: `?${params.toString()}` });
   }, [navigate, searchParams, event.job.id]);
 
   const handleSendEmailReminder = useCallback(() => {
@@ -187,8 +183,9 @@ export function ScheduleEventComponent({
     [title, handleTitleBlur, handleUnblock, event.arrived, t]
   );
 
-  const popoverContent = useMemo(
-    () => (
+  const popoverContent = useMemo(() => {
+    console.log("hit");
+    return (
       <div style={{ maxWidth: "40vw" }}>
         {!event.isintake ? (
           <Space>
@@ -301,17 +298,16 @@ export function ScheduleEventComponent({
           ) : null}
         </Space>
       </div>
-    ),
-    [
-      event,
-      t,
-      handlePreviewClick,
-      reminderMenu,
-      bodyshop.md_lost_sale_reasons,
-      handleCancelFormFinish,
-      handleRescheduleClick
-    ]
-  );
+    );
+  }, [
+    event,
+    t,
+    handlePreviewClick,
+    reminderMenu,
+    bodyshop.md_lost_sale_reasons,
+    handleCancelFormFinish,
+    handleRescheduleClick
+  ]);
 
   const RegularEvent = useMemo(
     () =>