Fix for him (#28)

icpc · Apr 23, 2024 · 397ed19 · 397ed19
1 parent 9da2435
commit 397ed19
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 29 deletions.
diff --git a/src/components/Body/Body.jsx b/src/components/Body/Body.jsx
@@ -62,7 +62,11 @@ const Body = () => {
     }, [data.fullscreenPhotoId]);
 
     const handleRotationRight = () => {
-        handleClick(photosList[fullscreenIndex + 1].id);
+        let newIndex = fullscreenIndex + 1;
+        if (newIndex >= photosList.length) {
+            newIndex = 0;
+        }
+        handleClick(photosList[newIndex].id);
     };
 
     const handleRotationLeft = () => {

diff --git a/src/components/Body/MyModal.jsx b/src/components/Body/MyModal.jsx
@@ -23,7 +23,7 @@ const MyModal = ({
     return (
         <div className="overlay dismiss" onClick={handleClick}>
             {isSlideShow
-                ? <Slideshow photo={photo} handleRotationRight={handleRotationRight} rightArrow={rightArrow} />
+                ? <Slideshow photo={photo} handleRotationRight={handleRotationRight} />
                 : <Lightbox photo={photo} handleRotationRight={handleRotationRight} handleRotationLeft={handleRotationLeft}
                     leftArrow={leftArrow} rightArrow={rightArrow} />}
         </div>

diff --git a/src/components/Body/Slideshow.jsx b/src/components/Body/Slideshow.jsx
@@ -1,39 +1,19 @@
 import React from "react";
 
-import { useAppContext } from "../AppContext";
-
 import Control from "./Control";
 
 import "../../styles/Body.css";
 
-const Slideshow = ({ photo, handleRotationRight, rightArrow }) => {
-    const timeoutRef = React.useRef(null);
-
-    const { setIsSlideShow } = useAppContext();
-
-    function resetTimeout() {
-        if (timeoutRef.current) {
-            clearTimeout(timeoutRef.current);
-        }
-    }
-
+const Slideshow = ({ photo, handleRotationRight }) => {
     React.useEffect(() => {
-        resetTimeout();
-        timeoutRef.current = setTimeout(
-            () => {
-                if (rightArrow) {
-                    handleRotationRight();
-                } else {
-                    setIsSlideShow(false);
-                }
-            },
-            3000
-        );
+        const interval = setInterval(() => {
+            handleRotationRight();
+        }, 3000);
 
         return () => {
-            resetTimeout();
+            clearInterval(interval);
         };
-    }, [photo]);
+    }, [handleRotationRight]);
 
     return (
         <div className="dismiss">

diff --git a/src/styles/theme-variables.css b/src/styles/theme-variables.css
@@ -2,7 +2,7 @@
     --mainBGColor: #1A1A1A;
     --mainColor: white;
     --additionalColor: #8A8A8A;
-    --opacityBGColor: rgba(27, 27, 27, 0.5);
+    --opacityBGColor: #000000;
     --additionalBGColor: #2E2E2E;
     --colorRectangle: yellow;
     --borderRectangle: yellow;