From 73d867fb047c27fc1a2f9192b8bde25738a77e60 Mon Sep 17 00:00:00 2001
From: Mounssif BOUHLAOUI <cv.bouhlaoui@gmail.com>
Date: Sun, 17 Dec 2023 13:22:44 +0100
Subject: [PATCH] Update UI

- add foter made with love link to github
- fix arrow move slide to be right color
---
 frontend/src/components/footer/footer.component.tsx        | 7 ++++---
 .../src/components/home/bikes/swiperBikes.component.tsx    | 7 ++++++-
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/footer/footer.component.tsx b/frontend/src/components/footer/footer.component.tsx
index 543db3d..b5c2d0b 100644
--- a/frontend/src/components/footer/footer.component.tsx
+++ b/frontend/src/components/footer/footer.component.tsx
@@ -16,7 +16,7 @@ const Footer = () => {
           <Link to="/">
             <Image src={logoImage} width={"150px"} />
           </Link>
-          <Flex gap="8" flexDirection={{ base: "column", md: "row" }}>
+          <Flex gap="8" mr={35} flexDirection={{ base: "column", md: "row" }}>
             <Link to="/">
               <Button
                 paddingStart={0}
@@ -40,7 +40,7 @@ const Footer = () => {
             </Link>
 
             {footerItems.map((item, i) => (
-              <A key={i} href={window.location.origin+"/"+item.path}>
+              <A key={i} href={window.location.origin + "/" + item.path}>
                 <Button
                   paddingStart={0}
                   paddingEnd={0}
@@ -70,7 +70,8 @@ const Footer = () => {
           <Link to="/" className="hover:underline">
             BikeHub
           </Link>
-          . All Rights Reserved.
+          . All Rights Reserved.<br />
+          <Link to="https://github.com/nuuxcode/BikeHub" className="hover:underline">Made with ❤️ by nuuX & Ayoub & Bio.</Link>
         </span>
       </div>
     </footer>
diff --git a/frontend/src/components/home/bikes/swiperBikes.component.tsx b/frontend/src/components/home/bikes/swiperBikes.component.tsx
index 8f0c438..22df455 100644
--- a/frontend/src/components/home/bikes/swiperBikes.component.tsx
+++ b/frontend/src/components/home/bikes/swiperBikes.component.tsx
@@ -12,6 +12,7 @@ const SwiperBikes = () => {
   const [parks, setParks] = useState([]);
   const [selectedParkId, setSelectedParkId] = useState("all");
   const swiperRef = useRef<SwiperCore | null>(null);
+  const [isSwiperInitialized, setIsSwiperInitialized] = useState(false);
   const [, setSlideIndex] = useState(0);
   useEffect(() => {
     axios
@@ -128,6 +129,10 @@ const SwiperBikes = () => {
             },
           }}
           spaceBetween={18}
+          onAfterInit={(swiper) => {
+            swiperRef.current = swiper;
+            setIsSwiperInitialized(true);
+          }}
           onSlideChange={(swiper) => {
             setSlideIndex(swiper.activeIndex);
           }}
@@ -149,7 +154,7 @@ const SwiperBikes = () => {
             onClick={() => swiperRef.current?.slidePrev()}
           />
           <HiArrowRight
-            className={`cursor-pointer font-bold transform hover:scale-125 transition-transform ${swiperRef.current?.isEnd ? 'text-gray-500' : 'text-green-500'}`}
+            className={`cursor-pointer font-bold transform hover:scale-125 transition-transform ${!isSwiperInitialized || swiperRef.current?.isEnd ? 'text-gray-500' : 'text-green-500'}`}
             size={24}
             onClick={() => swiperRef.current?.slideNext()}
           />