willba-component-library 0.1.42 → 0.1.44

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "willba-component-library",
-  "version": "0.1.42",
+  "version": "0.1.44",
   "description": "A stroybook 6 with TypeScript demo",
   "main": "lib/index.js",
   "module": "lib/index.esm.js",

package/src/components/FilterBar/components/calendar/Calendar.tsx

@@ -15,6 +15,10 @@ export const Calendar = forwardRef<HTMLDivElement, Props>(
   ({ calendarRange, setCalendarRange }: Props, ref) => {
     const isTablet = useMediaQuery({ maxWidth: 960 })
 
+    useEffect(() => {
+      if (!calendarRange) setCalendarRange(undefined)
+    }, [])
+
     const today = startOfDay(new Date())
 
     const disabledDays = [
@@ -23,21 +27,14 @@ export const Calendar = forwardRef<HTMLDivElement, Props>(
         to: addDays(today, -50),
       },
     ]
-
-    useEffect(() => {
-      if (!calendarRange) setCalendarRange(undefined)
-    }, [])
+    const selectedStartDate = calendarRange?.from
 
     return (
       <div className="will-filter-bar-calendar" ref={ref}>
-        {/* <div className="will-calendar-filter-header">
-        <h3 className="will-calendar-filter-title">{t('calendar.title')}</h3>
-      </div> */}
         <div className="will-calendar-filter-container">
           <DayPicker
             id="will-calendar"
             mode="range"
-            //showOutsideDays
             numberOfMonths={!isTablet ? 2 : 1}
             weekStartsOn={1}
             selected={calendarRange}
@@ -49,7 +46,7 @@ export const Calendar = forwardRef<HTMLDivElement, Props>(
               disabled: { opacity: '0.2' },
             }}
             captionLayout="dropdown-buttons"
-            defaultMonth={today}
+            defaultMonth={selectedStartDate || today}
             disabled={disabledDays}
             fromMonth={today}
           />

package/src/components/FilterBar/components/guests/GuestCount/GuestCount.tsx

@@ -12,6 +12,12 @@ export default function GuestCount({
   count,
   minVal,
 }: GuestsCountPropsType) {
+  useEffect(() => {
+    if (minVal && minVal > count) {
+      updateGuestsCount(`guests-${id}`, minVal)
+    }
+  }, [])
+
   const handleDecrement = () => {
     if (count > minVal) {
       updateGuestsCount(`guests-${id}`, count - 1)
@@ -30,15 +36,12 @@ export default function GuestCount({
         <button
           className="will-guests-filter-counter-button"
           onClick={handleDecrement}
-          disabled={minVal && count <= minVal ? true : false}
+          disabled={(minVal && count <= minVal) || !count ? true : false}
           style={{
             cursor:
-              minVal && count <= minVal
-                ? 'initial'
-                : !minVal && count < 1
-                ? 'initial'
-                : 'pointer',
+              (minVal && count <= minVal) || !count ? 'initial' : 'pointer',
             paddingBottom: '4px',
+            opacity: (minVal && count <= minVal) || !count ? 0.4 : 1,
           }}
         >
           -

package/src/components/FilterBar/hooks/useFilterBar.tsx

@@ -91,10 +91,9 @@ export const useFilterBar = ({
         : '',
       endDate: calendarRange?.to ? format(calendarRange.to, 'yyyy-MM-dd') : '',
       categories,
-      ageCategoryCounts: handleAgeCategoryRules({
-        ageCategoryCounts,
-        ageCategories,
-      }),
+      ageCategoryCounts: Object.entries(ageCategoryCounts).length
+        ? JSON.stringify(ageCategoryCounts)
+        : '',
     }
 
     if (currentViewApply) {
@@ -158,41 +157,3 @@ export const useFilterBar = ({
     setSelectedPath,
   }
 }
-
-////////////
-
-const handleAgeCategoryRules = ({
-  ageCategoryCounts,
-  ageCategories,
-}: {
-  ageCategoryCounts: AgeCategoryCount
-  ageCategories?: AgeCategoryType[]
-}) => {
-  if (ageCategories?.length) {
-    ageCategories?.map((a) => {
-      if (a.minVal) {
-        // Age categories rules
-        const totalAgeCategories = Object.entries(ageCategoryCounts).reduce(
-          (acc, c) => {
-            return acc + c[1]
-          },
-          0
-        )
-        const ageCategory = ageCategoryCounts[`guests-${a.id}`]
-
-        if (
-          !totalAgeCategories ||
-          (totalAgeCategories === 1 && ageCategory === 1)
-        ) {
-          ageCategoryCounts[`guests-${a.id}`] = 2
-        } else if (totalAgeCategories > 1 && !ageCategory) {
-          ageCategoryCounts[`guests-${a.id}`] = a.minVal
-        }
-      }
-    })
-  }
-
-  return Object.entries(ageCategoryCounts).length
-    ? JSON.stringify(ageCategoryCounts)
-    : ''
-}