attempt to resolve hyperlist issue with flushSync

complexdatacollective · Dec 11, 2023 · a69f3d7 · a69f3d7
1 parent 8b9d1bb
commit a69f3d7
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 363 deletions.
diff --git a/app/(interview)/interview/_components/InterviewShell.tsx b/app/(interview)/interview/_components/InterviewShell.tsx
@@ -42,6 +42,12 @@ const ServerSync = ({ interviewId }: { interviewId: string }) => {
       return;
     }
 
+    // check if current stage index is null (happens when hot reloading)
+    if (currentSession.currentStep === null) {
+      console.log('⚠️ Current stage index is null. Skipping sync.');
+      return;
+    }
+
     console.log(`⬆️ Syncing session with server...`);
     syncSessionWithServer({
       id: interviewId,

diff --git a/lib/interviewer/behaviours/DragAndDrop/DragAndDropSlice.ts b/lib/interviewer/behaviours/DragAndDrop/DragAndDropSlice.ts
diff --git a/lib/interviewer/behaviours/DragAndDrop/DragSource.js b/lib/interviewer/behaviours/DragAndDrop/DragSource.js
@@ -75,7 +75,7 @@ const dragSource = (WrappedComponent) => ({
         x, y, setValidMove, ...other,
       }),
     );
-  }, 60);
+  }, 250);
 
   const onDragMove = ({ x, y, ...other }) => {
     updatePreview({ x, y });
@@ -111,26 +111,32 @@ const dragSource = (WrappedComponent) => ({
   const styles = () => (isDragging ? { visibility: 'hidden' } : {});
 
   return (
-    <div style={styles()} className={`draggable ${!allowDrag ? 'draggable--disabled' : ''}`} ref={node}>
-      <WrappedComponent
-        {...rest}
-        allowDrag={allowDrag}
-        scrollDirection={scrollDirection}
-      />
-      {preview && (
-        <div
-          ref={previewRef}
-          style={{
-            display: 'none',
-            position: 'absolute',
-            top: 0,
-            left: 0,
-          }}
-        >
-          {preview}
+    <>
+      {!isDragging && (
+        <div className={`draggable ${!allowDrag ? 'draggable--disabled' : ''}`} ref={node}>
+          <WrappedComponent
+            {...rest}
+            allowDrag={allowDrag}
+            scrollDirection={scrollDirection}
+          />
         </div>
       )}
-    </div>
+      {
+        preview && (
+          <div
+            ref={previewRef}
+            style={{
+              display: 'none',
+              position: 'absolute',
+              top: 0,
+              left: 0,
+            }}
+          >
+            {preview}
+          </div>
+        )
+      }
+    </>
   );
 };