@rileybathurst/paddle 1.0.2 → 1.0.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rileybathurst/paddle",
   "private": false,
-  "version": "1.0.2",
+  "version": "1.0.4",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/PaddleBrandList.tsx

@@ -0,0 +1,64 @@
+import * as React from "react"
+import { Link } from 'gatsby';
+
+// * additional work is done here to split kayak and paddleboard
+
+type BrandListTypes = {
+  nodes: {
+    id: string;
+    slug: string;
+    svg: string;
+    name: string;
+    retail: {
+      title: string;
+      slug: string;
+      sport: {
+        slug: string;
+      }
+    }[]
+  }[];
+  sport?: string;
+}
+
+const PaddleBrandList = ({ nodes, sport }: BrandListTypes) => {
+
+  const BrandSet = new Set();
+  let BrandArray = [];
+
+  if (sport) {
+    nodes.map((brand) => {
+      brand.retail.map((retail) => {
+
+        if (retail.sport.slug === sport) {
+          BrandSet.add(brand);
+        }
+
+        return BrandSet;
+      })
+    });
+
+    BrandArray = (Array.from(BrandSet));
+  } else {
+    // TODO: this needs a check if anything is published in the brand if no sport is passed
+    BrandArray = (Array.from(nodes));
+  }
+
+  return (
+    <ul className='brand_list'>
+      {BrandArray.map((brand: any) => (
+        <li key={brand.id}>
+          <Link to={`/retail/${sport}/${brand.slug}`}>
+            {brand.svg ?
+              <div
+                dangerouslySetInnerHTML={{ __html: brand.svg }}
+              />
+              : null}
+            {brand.name}
+          </Link>
+        </li>
+      ))}
+    </ul>
+  )
+}
+
+export default PaddleBrandList

package/src/PaddleLocationDeck.tsx

@@ -1,19 +1,19 @@
 import * as React from "react"
 import { PaddleLocationCard } from "./PaddleLocationCard";
-import type { LocationCardTypes } from "./types/location-card-types";
+import type { PaddleLocationCardTypes } from "./types/location-card-types";
 
 interface LocationDeckTypes {
   background?: string;
   season_start?: string; // ? should this be optional? it created a problem with tours
   season_end?: string;
   phone?: string;
-  nodes: LocationCardTypes[];
+  nodes: PaddleLocationCardTypes[];
 }
 export function PaddleLocationDeck({ nodes, season_start, season_end, phone, background }: LocationDeckTypes) {
 
   return (
     <section className="location-deck">
-      {nodes.map((location: LocationCardTypes) => (
+      {nodes.map((location: PaddleLocationCardTypes) => (
         <PaddleLocationCard
           key={location.id}
           {...location}

package/src/PaddleTicket.tsx

@@ -3,8 +3,9 @@ import { Link } from "gatsby"
 import { GatsbyImage } from "gatsby-plugin-image"
 import type { PaddleTicketTypes } from "./types/ticket-types"
 import { PaddleTime } from "./PaddleTime"
+import { PaddleBookNow } from "./PaddleBookNow"
 
-export function PaddleTicket({ ogimage, slug, name, start, finish, duration, timeframe, fitness, excerpt, price, peek, peek_tours_fall_back, tour_page, allStrapiSunsetTourTime }: PaddleTicketTypes) {
+export function PaddleTicket({ ogimage, slug, name, start, finish, duration, timeframe, fitness, excerpt, price, peek, peek_tours_fall_back, tour_page, allStrapiSunsetTourTime, strapiLocaleName }: PaddleTicketTypes) {
 
   const time = PaddleTime({
     start: start,
@@ -16,7 +17,6 @@ export function PaddleTicket({ ogimage, slug, name, start, finish, duration, tim
     slug: slug
   });
 
-
   return (
     <section className="ticket">
       <Link to={`/${tour_page}/${slug}`}>
@@ -27,33 +27,33 @@ export function PaddleTicket({ ogimage, slug, name, start, finish, duration, tim
           className="card__image"
         />
       </Link>
-      <h4 className="card__title">
-        <Link to={`/${tour_page}/${slug}`}>
-          {name}
-        </Link>
-      </h4>
-
-      {/* // * heavy handed but once the backup is there we can work on this */}
-      {slug !== '2hour' && slug !== '3hour' ?
-        <div className="card__specs">
-          <h4>{time.entry}</h4>
-          {/* // TODO: I'd like a spec backup here */}
-          {fitness ? <h4 className="capitalize">{fitness} <span>Fitness</span></h4> : null}
+      <div className='ticket__header'>
+        <h4 className="card__title">
+          <Link to={`/${tour_page}/${slug}`}>
+            {name}
+          </Link>
+        </h4>
+        
+        <div className='ticket__money'>
+        <h5>${price}</h5>
+        <PaddleBookNow
+          peek_base={peek || peek_tours_fall_back}
+          strapiLocaleName={strapiLocaleName}
+        />
         </div>
-        : null}
-      <hr />
+      </div>
+
+      <div className="ticket__specs">
+        {/* // TODO: heavy handed but once the backup is there we can work on this */}
+        {/* // TODO: I'd like a spec backup here */}
+
+        {slug !== '2hour' && slug !== '3hour' ? (
+          <>
+            <h4>{time.entry}</h4>
+            {fitness ? <h4 className="capitalize">{fitness} <span>Fitness</span></h4> : null}
+          </>
+        ) : null }
       <p>{excerpt}</p>
-      <hr />
-      <div className="card__details">
-        <h5>${price}</h5>
-        <a
-          href={peek ? peek : peek_tours_fall_back}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="book-now"
-        >
-          BOOK NOW
-        </a>
       </div>
 
     </section>

package/src/index.tsx

@@ -17,6 +17,7 @@ export * from "./PaddleTestimonial";
 // Organisms
 export * from "./PaddleLocationDeck";
 export * from "./PaddleTestimonials";
+export * from "./PaddleBrandList";
 
 // Templates
 
@@ -25,7 +26,6 @@ export * from "./PaddleTestimonials";
 // SEO
 export * from "./PaddleSEO";
 
-// TODO: test v.1.1
 // Types
 export * from "./types/ticket-types";
 export * from "./types/location-card-types";

package/src/types/location-card-types.ts

@@ -1,4 +1,4 @@
-export interface LocationCardTypes {
+export interface PaddleLocationCardTypes {
   id: React.Key;
   svg: string;
   name: string;

package/src/types/ticket-types.ts

@@ -28,4 +28,6 @@ export interface PaddleTicketTypes {
       endTime: string;
     }[];
   };
+
+  strapiLocaleName: string;
 }