disable arrows when submit proof modal is open

the arrows will still move the cursor correctly

packages/web/components/Carousel/CarouselContext.tsx

@@ -9,6 +9,9 @@ type CarouselContextType = {
   isDragging: boolean;
   setDragging: React.Dispatch<React.SetStateAction<boolean>>;
 
+  isSubmittingProof: boolean;
+  setIsSubmittingProof: React.Dispatch<React.SetStateAction<boolean>>;
+
   positions: number[];
   itemWidth: number;
   constraint: number;
@@ -25,6 +28,8 @@ export const CarouselContext = createContext<CarouselContextType>({
   setTrackIsActive: () => undefined,
   activeItem: 0,
   setActiveItem: () => undefined,
+  isSubmittingProof: false,
+  setIsSubmittingProof: () => undefined,
   isDragging: false,
   setDragging: () => undefined,
   sliderWidth: 0,

packages/web/components/Carousel/Track.tsx

@@ -24,6 +24,7 @@ export const Track: React.FC = ({ children }) => {
     setDragging,
     setTrackIsActive,
     trackIsActive,
+    isSubmittingProof,
     setActiveItem,
     activeItem,
     constraint,
@@ -31,6 +32,7 @@ export const Track: React.FC = ({ children }) => {
     itemWidth,
     positions,
   } = useCarouselContext();
+
   const [dragStartPosition, setDragStartPosition] = useState(0);
   const controls = useAnimation();
   const x = useMotionValue(0);
@@ -104,7 +106,7 @@ export const Track: React.FC = ({ children }) => {
 
   const handleKeyDown = useCallback(
     (event: KeyboardEvent) => {
-      if (trackIsActive) {
+      if (trackIsActive && !isSubmittingProof) {
         if (activeItem < positions.length - constraint) {
           if (event.key === 'ArrowRight' || event.key === 'ArrowUp') {
             event.preventDefault();
@@ -119,7 +121,14 @@ export const Track: React.FC = ({ children }) => {
         }
       }
     },
-    [trackIsActive, setActiveItem, activeItem, constraint, positions.length],
+    [
+      trackIsActive,
+      isSubmittingProof,
+      activeItem,
+      positions.length,
+      constraint,
+      setActiveItem,
+    ],
   );
 
   useEffect(() => {

packages/web/components/Carousel/index.tsx

@@ -11,6 +11,7 @@ export const Carousel: React.FC<{ gap: number; children: JSX.Element[] }> = ({
   gap,
 }) => {
   const [trackIsActive, setTrackIsActive] = useState(false);
+  const [isSubmittingProof, setIsSubmittingProof] = useState(false);
   const [activeItem, setActiveItem] = useState(0);
   const [isDragging, setDragging] = useState(false);
   const [multiplier, setMultiplier] = useState(0.35);
@@ -50,6 +51,8 @@ export const Carousel: React.FC<{ gap: number; children: JSX.Element[] }> = ({
         trackIsActive,
         setTrackIsActive,
         activeItem,
+        isSubmittingProof,
+        setIsSubmittingProof,
         setActiveItem,
         isDragging,
         setDragging,

packages/web/components/QuestChain/UploadProof.tsx

@@ -19,6 +19,7 @@ import {
   UseToastOptions,
 } from '@metafam/ds';
 import { contracts, graphql, helpers } from '@quest-chains/sdk';
+import { useCarouselContext } from 'components/Carousel/CarouselContext';
 import { useWeb3 } from 'lib/hooks';
 import { useDropFiles, useDropImage } from 'lib/hooks/useDropFiles';
 import { useInputText } from 'lib/hooks/useInputText';
@@ -44,6 +45,8 @@ export const UploadProof: React.FC<{
   const { chainId, provider, address } = useWeb3();
   const { isOpen, onOpen, onClose } = useDisclosure();
 
+  const { setIsSubmittingProof } = useCarouselContext();
+
   const toast = useToast();
   const toastIdRef = useRef<ToastId | undefined>(undefined);
 
@@ -74,7 +77,14 @@ export const UploadProof: React.FC<{
     onResetFiles();
     onResetImage();
     onClose();
-  }, [onClose, onResetFiles, onResetImage, setProofDescription]);
+    setIsSubmittingProof(false);
+  }, [
+    onClose,
+    onResetFiles,
+    onResetImage,
+    setIsSubmittingProof,
+    setProofDescription,
+  ]);
 
   const onSubmit = useCallback(async () => {
     if (
@@ -181,7 +191,10 @@ export const UploadProof: React.FC<{
         isDisabled={chainId === questChain.chainId}
       >
         <StatusedSubmitButton
-          onClick={onOpen}
+          onClick={() => {
+            setIsSubmittingProof(true);
+            onOpen();
+          }}
           status={null}
           isDisabled={chainId !== questChain.chainId || !address}
           borderWidth={1}