willba-component-library 0.0.90 → 0.1.0

package/package.json

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

package/src/components/FilterBar/FilterBar.stories.tsx

@@ -39,5 +39,6 @@ export const Primary: Story = {
         minVal: 0,
       },
     ],
+    redirectUrl: '',
   },
 }

package/src/components/FilterBar/FilterBar.tsx

@@ -21,12 +21,14 @@ interface FilterBarProps {
   vendor?: string
   language?: string
   ageCategories?: AgeCategoryType[]
+  redirectUrl: string
 }
 
 export default function FilterBar({
   vendor,
   language,
-  ageCategories = ageCategoriesFallback,
+  ageCategories = AGE_CATEGORIES_FALLBACK,
+  redirectUrl = REDIRECT_URL_FALLBACK,
 }: FilterBarProps) {
   const themeClass = useTheme({ vendor })
   const [rerenderKey, setRerenderKey] = useState(0)
@@ -50,7 +52,7 @@ export default function FilterBar({
     handleSubmit,
     updateGuestsCount,
     handleResetFilters,
-  } = useFilterBar(ageCategories)
+  } = useFilterBar({ redirectUrl })
 
   return (
     <>
@@ -127,11 +129,13 @@ export default function FilterBar({
   )
 }
 
+////////////
+
 const fontWigthBold = (input: boolean) => {
   return { fontWeight: input ? 'bold' : 'initial' }
 }
 
-const ageCategoriesFallback = [
+const AGE_CATEGORIES_FALLBACK = [
   {
     id: '1',
     name: 'Adults',
@@ -147,3 +151,5 @@ const ageCategoriesFallback = [
     minVal: 0,
   },
 ]
+
+const REDIRECT_URL_FALLBACK = 'http://localhost:3000/'

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

@@ -2,9 +2,13 @@ import { useEffect, useState } from 'react'
 import { DateRange } from 'react-day-picker'
 import { format } from 'date-fns'
 
-import { AgeCategoryCount } from '../FilterBarTypes'
+import { AgeCategoryCount, AgeCategoryType } from '../FilterBarTypes'
 
-export default function useFilterBar(ageCategories: any) {
+interface UseFilterBarPropsType {
+  redirectUrl: string
+}
+
+export default function useFilterBar({ redirectUrl }: UseFilterBarPropsType) {
   const [selectedFilter, setSelectedFilter] = useState<number | boolean>(false)
   const [calendarRange, setCalendarRange] = useState<DateRange | undefined>()
 
@@ -65,8 +69,9 @@ export default function useFilterBar(ageCategories: any) {
       }
     }
 
-    const url = `http://localhost:4000/en/events/?${queryParams.toString()}`
-    window.location.href = url
+    window.location.href = `${redirectUrl}${
+      queryParams ? `?${queryParams.toString()}` : ''
+    }`
     handleSelectedFilter(false)
   }