@rileybathurst/paddle 1.9.18 → 1.9.20

package/package.json

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

package/src/paddle-purchase.tsx

@@ -54,8 +54,8 @@ export const PaddlePurchase = ({
   demo,
   discount,
   cutout,
-  sportSlug,
-  brandSlug,
+  sport,
+  brand,
   baseOne,
   baseTwo,
   baseThree,
@@ -76,13 +76,13 @@ export const PaddlePurchase = ({
           topThree={topThree}
         />
         <Link
-          to={`/retail/${sportSlug}/${brandSlug}/${slug}`}
+          to={`/retail/${sport.slug}/${brand.slug}/${slug}`}
           className="image-link"
         >
           {cutout && (
             <GatsbyImage
               image={cutout.localFile?.childImageSharp?.gatsbyImageData}
-              alt={cutout.alternativeText || `${title} by ${brandSlug}`}
+              alt={cutout.alternativeText || `${title} by ${brand.name}`}
               className="cutout"
               objectFit="contain"
             />
@@ -95,7 +95,7 @@ export const PaddlePurchase = ({
         />
       </div>
       <h4 className="purchase__title">
-        <Link to={`/retail/${sportSlug}/${brandSlug}/${slug}`}>{title}</Link>
+        <Link to={`/retail/${sport.slug}/${brand.slug}/${slug}`}>{title}</Link>
       </h4>
       <hr />
       <p>{excerpt}</p>

package/src/paddle-specs.tsx

@@ -1,12 +1,19 @@
 import * as React from "react";
 import PaddleRemainder from "./paddle-remainder";
 
-interface SpecsTypes {
-  [key: string]:
-  | string
-  | number
+/* * this is slightly complex to allow for time
+const specs: SpecsTypes = {
+  name: "turbo",        // ✅ string
+  power: 500,           // ✅ number
+  dimensions: {         // ✅ nested object
+    width: 100,         // ✅ number
+    unit: "px",         // ✅ string
+  }
+} */
+type SpecsTypes = {
+  [key: string]: | string | number
   | {
-    [key: string]: string | number[];
+    [key: string]: string | number;
   };
 }
 // * moving the section tag to the parent component means you can loop yourself
@@ -16,9 +23,11 @@ export const PaddleSpecs = (specs: SpecsTypes) =>
     // console.log(key, value);
 
     if (!value) {
+      console.warn(`Missing value for ${key}`);
       return null;
     }
 
+    // * time is a special case as it has a nested value
     if (key === "time" && typeof value === "object") {
       return (
         <div key={key} className="spec">
@@ -30,6 +39,15 @@ export const PaddleSpecs = (specs: SpecsTypes) =>
       // * I cant remeber others yet
     }
 
+
+
+
+
+
+
+
+
+
     if (key === "cost" && typeof value === "object" && value.discount) {
       const amount = (Number(value.price) -
         Number(value.discount) * (Number(value.price) / 100)) as number;

package/src/types/paddle-purchase-types.ts

@@ -14,10 +14,14 @@ export type PaddlePurchaseTypes = {
   cutout: PaddleGatsbyImageType;
 
   sport: {
+    id: React.Key;
     slug: string
+    title: string;
   };
   brand: {
+    id: React.Key;
     slug: string
+    name: string;
   };
 
   baseOne: { image: PaddleGatsbyImageType };