From 1bf68d50e022c07293d643ff0e33ebd2727a2a78 Mon Sep 17 00:00:00 2001
From: Leo Giovanetti <hello@leog.me>
Date: Wed, 30 Aug 2023 16:19:00 -0300
Subject: [PATCH] fix: multiple duration when booking (#11032)

---
 .../components/event-meta/Duration.tsx        | 21 +++++++++++--------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/packages/features/bookings/components/event-meta/Duration.tsx b/packages/features/bookings/components/event-meta/Duration.tsx
index 94f3c1009c..eda63e6e95 100644
--- a/packages/features/bookings/components/event-meta/Duration.tsx
+++ b/packages/features/bookings/components/event-meta/Duration.tsx
@@ -9,9 +9,10 @@ import type { PublicEvent } from "../../types";
 
 export const EventDuration = ({ event }: { event: PublicEvent }) => {
   const { t } = useLocale();
-  const [selectedDuration, setSelectedDuration] = useBookerStore((state) => [
+  const [selectedDuration, setSelectedDuration, state] = useBookerStore((state) => [
     state.selectedDuration,
     state.setSelectedDuration,
+    state.state,
   ]);
 
   const isDynamicEvent = "isDynamic" in event && event.isDynamic;
@@ -30,14 +31,16 @@ export const EventDuration = ({ event }: { event: PublicEvent }) => {
 
   return (
     <div className="flex flex-wrap gap-2">
-      {durations.map((duration) => (
-        <Badge
-          variant="gray"
-          className={classNames(selectedDuration === duration && "bg-brand-default text-brand")}
-          size="md"
-          key={duration}
-          onClick={() => setSelectedDuration(duration)}>{`${duration} ${t("minute_timeUnit")}`}</Badge>
-      ))}
+      {durations
+        .filter((dur) => state !== "booking" || dur === selectedDuration)
+        .map((duration) => (
+          <Badge
+            variant="gray"
+            className={classNames(selectedDuration === duration && "bg-brand-default text-brand")}
+            size="md"
+            key={duration}
+            onClick={() => setSelectedDuration(duration)}>{`${duration} ${t("minute_timeUnit")}`}</Badge>
+        ))}
     </div>
   );
 };