From 594573879e8d48eb81cf02f85a80d292f1d069f4 Mon Sep 17 00:00:00 2001
From: Alex Mickelson <alexmickelson96@gmail.com>
Date: Tue, 19 Nov 2024 09:17:16 -0700
Subject: [PATCH] adding in delay to handle network latency

---
 .../lecture/[lectureDay]/EditLecture.tsx       |  7 ++++++-
 .../[assignmentName]/AssignmentButtons.tsx     | 18 ++++++++++--------
 .../utils/useAuthoritativeUpdates.tsx          |  6 ++++--
 3 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/nextjs/src/app/course/[courseName]/lecture/[lectureDay]/EditLecture.tsx b/nextjs/src/app/course/[courseName]/lecture/[lectureDay]/EditLecture.tsx
index d4563ad..151106c 100644
--- a/nextjs/src/app/course/[courseName]/lecture/[lectureDay]/EditLecture.tsx
+++ b/nextjs/src/app/course/[courseName]/lecture/[lectureDay]/EditLecture.tsx
@@ -20,7 +20,7 @@ import { useAuthoritativeUpdates } from "../../utils/useAuthoritativeUpdates";
 export default function EditLecture({ lectureDay }: { lectureDay: string }) {
   const { courseName } = useCourseContext();
   const [settings] = useLocalCourseSettingsQuery();
-  const [weeks, { dataUpdatedAt: serverDataUpdatedAt }] =
+  const [weeks, { dataUpdatedAt: serverDataUpdatedAt, isFetching }] =
     useLecturesSuspenseQuery();
   const updateLecture = useLectureUpdateMutation();
 
@@ -40,6 +40,10 @@ export default function EditLecture({ lectureDay }: { lectureDay: string }) {
 
     const handler = setTimeout(() => {
       try {
+        if (isFetching || updateLecture.isPending) {
+          console.log("network requests in progress, not updating page");
+          return;
+        }
         const parsed = parseLecture(text);
         if (!lecture || lectureToString(parsed) !== lectureToString(lecture)) {
           if (clientIsAuthoritative) {
@@ -70,6 +74,7 @@ export default function EditLecture({ lectureDay }: { lectureDay: string }) {
   }, [
     clientIsAuthoritative,
     courseName,
+    isFetching,
     lecture,
     settings,
     text,
diff --git a/nextjs/src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/AssignmentButtons.tsx b/nextjs/src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/AssignmentButtons.tsx
index 4a49ea9..9991e56 100644
--- a/nextjs/src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/AssignmentButtons.tsx
+++ b/nextjs/src/app/course/[courseName]/modules/[moduleName]/assignment/[assignmentName]/AssignmentButtons.tsx
@@ -30,12 +30,12 @@ export function AssignmentButtons({
   const router = useRouter();
   const { courseName } = useCourseContext();
   const [settings] = useLocalCourseSettingsQuery();
-  const {
-    data: canvasAssignments,
-    isPending: canvasIsPending,
-    isRefetching: canvasIsRefetching,
-  } = useCanvasAssignmentsQuery();
-  const [assignment] = useAssignmentQuery(moduleName, assignmentName);
+  const { data: canvasAssignments, isFetching: canvasIsFetching } =
+    useCanvasAssignmentsQuery();
+  const [assignment, { isFetching }] = useAssignmentQuery(
+    moduleName,
+    assignmentName
+  );
   const addToCanvas = useAddAssignmentToCanvasMutation();
   const deleteFromCanvas = useDeleteAssignmentFromCanvasMutation();
   const updateAssignment = useUpdateAssignmentInCanvasMutation();
@@ -49,11 +49,13 @@ export function AssignmentButtons({
 
   const anythingIsLoading =
     addToCanvas.isPending ||
-    canvasIsPending ||
-    canvasIsRefetching ||
+    canvasIsFetching ||
+    isFetching ||
     deleteFromCanvas.isPending ||
     updateAssignment.isPending;
 
+  console.log("assignment pending", updateAssignment.isPending);
+
   return (
     <div className="p-5 flex flex-row justify-between gap-3">
       <div>
diff --git a/nextjs/src/app/course/[courseName]/utils/useAuthoritativeUpdates.tsx b/nextjs/src/app/course/[courseName]/utils/useAuthoritativeUpdates.tsx
index 391be89..8e8e6c1 100644
--- a/nextjs/src/app/course/[courseName]/utils/useAuthoritativeUpdates.tsx
+++ b/nextjs/src/app/course/[courseName]/utils/useAuthoritativeUpdates.tsx
@@ -13,8 +13,10 @@ export function useAuthoritativeUpdates({
     useState(serverUpdatedAt);
   const [updateMonacoKey, setUpdateMonacoKey] = useState(1);
   const clientIsAuthoritative = useMemo(() => {
-    const authority = serverUpdatedAt <= clientDataUpdatedAt;
-    // const authority = serverUpdatedAt <= clientDataUpdatedAt + 500; // if it is close, it might be the second-to-last update changing the first (by file update delays), add some buffer...
+    // const authority = serverUpdatedAt <= clientDataUpdatedAt;
+    const estimatedNetworkRoundTrip = 500; // network latency means client is still authoritative for a slight delay
+    const authority =
+      serverUpdatedAt <= clientDataUpdatedAt + estimatedNetworkRoundTrip;
     // console.log("client is authoritative", authority);
     return authority;
   }, [clientDataUpdatedAt, serverUpdatedAt]);