@rileybathurst/paddle 1.9.44 → 1.9.45

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rileybathurst/paddle",
   "private": false,
-  "version": "1.9.44",
+  "version": "1.9.45",
   "type": "module",
   "scripts": {
     "dev": "tsc --noEmit && stay-gold && vite",

package/src/paddle-compare.tsx

@@ -12,7 +12,7 @@ type CompareDetailsTypes = {
   id: React.Key;
   name: TourType["name"];
   onTourChange: (value: TourType["name"]) => void;
-  image: TourType["image"] | null;
+  compositionImage: TourType["compositionImage"] | null;
   link: TourType["slug"];
   sport: TourType["sport"];
   duration?: TourType["duration"];
@@ -34,7 +34,7 @@ type CompareDetailsTypes = {
 const CompareDetails = ({
   name,
   onTourChange,
-  image,
+  compositionImage,
   link,
   sport,
   duration,
@@ -80,13 +80,13 @@ const CompareDetails = ({
         ))}
       </select>
 
-      {image ? (
+      {compositionImage ? (
         <GatsbyImage
-          image={image.localFile.childImageSharp.gatsbyImageData}
-          alt={image.alternativeText || name}
+          image={compositionImage.localFile.childImageSharp.gatsbyImageData}
+          alt={compositionImage.alternativeText || name}
           className="comparesheet_image"
         />
-      ) : null}
+      ) : <React.Fragment>&nbsp;</React.Fragment>}
 
       <h2 className="kilimanjaro">
         <Link to={`/${breadcrumb}/${link}`}>
@@ -132,8 +132,8 @@ export const PaddleCompare = ({ tours, breadcrumb, strapiBranchName, peek_base }
 
   let [tour1, setTour1] = useState(tours[0].name || "Tour 1");
   let [tour2, setTour2] = useState(tours[1].name || "Tour 2");
-  let [image1, setImage1] = useState(tours[0].image || null);
-  let [image2, setImage2] = useState(tours[1].image || null);
+  let [image1, setImage1] = useState(tours[0].compositionImage || null);
+  let [image2, setImage2] = useState(tours[1].compositionImage || null);
   let [link1, setLink1] = useState(tours[0].slug || "not set");
   let [link2, setLink2] = useState(tours[1].slug || "not set");
   let [sport1, setSport1] = useState(tours[0].sport || "not set");
@@ -164,7 +164,7 @@ export const PaddleCompare = ({ tours, breadcrumb, strapiBranchName, peek_base }
     if (!selectedTour) return;
 
     setTour1(selectedTour.name);
-    setImage1(selectedTour.image || null);
+    setImage1(selectedTour.compositionImage || null);
     setLink1(selectedTour.slug || "not set");
     setSport1(selectedTour.sport || "not set");
     setDuration1(selectedTour.duration || 0);
@@ -184,7 +184,7 @@ export const PaddleCompare = ({ tours, breadcrumb, strapiBranchName, peek_base }
     if (!selectedTour) return;
 
     setTour2(selectedTour.name);
-    setImage2(selectedTour.image || null);
+    setImage2(selectedTour.compositionImage || null);
     setLink2(selectedTour.slug || "not set");
     setSport2(selectedTour.sport || "not set");
     setDuration2(selectedTour.duration || 0);
@@ -222,7 +222,7 @@ export const PaddleCompare = ({ tours, breadcrumb, strapiBranchName, peek_base }
         <CompareDetails
           id={id1}
           name={tour1}
-          image={image1}
+          compositionImage={image1}
           onTourChange={updateTour1}
           link={link1}
           sport={sport1}
@@ -246,7 +246,7 @@ export const PaddleCompare = ({ tours, breadcrumb, strapiBranchName, peek_base }
         <CompareDetails
           id={id2}
           name={tour2}
-          image={image2}
+          compositionImage={image2}
           onTourChange={updateTour2}
           link={link2}
           sport={sport2}

package/src/types/paddle-compare-types.tsx

@@ -5,7 +5,7 @@ export type PaddleCompareTypes = {
   tours: {
     id: React.Key;
     name: string;
-    image: PaddleGatsbyImageType;
+    compositionImage: PaddleGatsbyImageType;
     slug: string;
     sport: string;
     duration?: number;