feat(SW-885): ancillary and book next stay

components/Forms/BookingWidget/FormContent/Search/index.tsx

@@ -22,7 +22,10 @@ import SearchList from "./SearchList"
 import styles from "./search.module.css"
 
 import type { BookingWidgetSchema } from "@/types/components/bookingWidget"
-import { ActionType } from "@/types/components/form/bookingwidget"
+import {
+  ActionType,
+  SetStorageData,
+} from "@/types/components/form/bookingwidget"
 import type { SearchProps } from "@/types/components/search"
 import type { Location } from "@/types/trpc/routers/hotel/locations"
 
@@ -40,7 +43,7 @@ export default function Search({ locations, handlePressEnter }: SearchProps) {
       : null
   const [state, dispatch] = useReducer(
     reducer,
-    { defaultLocations: locations },
+    { defaultLocations: locations, initialValue: value },
     init
   )
   const handleMatchLocations = useCallback(
@@ -122,30 +125,19 @@ export default function Search({ locations, handlePressEnter }: SearchProps) {
   }
 
   useEffect(() => {
-    const searchData =
-      typeof window !== "undefined"
-        ? sessionStorage.getItem(sessionStorageKey)
-        : undefined
-
-    const searchHistory =
-      typeof window !== "undefined"
-        ? localStorage.getItem(localStorageKey)
-        : null
-    if (searchData || searchHistory) {
-      dispatch({
-        payload: {
-          searchData:
-            isValidJson(searchData) && searchData
-              ? JSON.parse(searchData)
-              : undefined,
-          searchHistory:
-            isValidJson(searchHistory) && searchHistory
-              ? JSON.parse(searchHistory)
-              : null,
-        },
-        type: ActionType.SET_STORAGE_DATA,
-      })
+    const searchData = sessionStorage.getItem(sessionStorageKey)
+    const searchHistory = localStorage.getItem(localStorageKey)
+    const payload: SetStorageData["payload"] = {}
+    if (searchData) {
+      payload.searchData = JSON.parse(searchData)
     }
+    if (searchHistory) {
+      payload.searchHistory = JSON.parse(searchHistory)
+    }
+    dispatch({
+      payload,
+      type: ActionType.SET_STORAGE_DATA,
+    })
   }, [dispatch])
 
   const stayType = state.searchData?.type === "cities" ? "city" : "hotel"

components/Forms/BookingWidget/FormContent/Search/reducer.ts

@@ -10,11 +10,20 @@ export const localStorageKey = "searchHistory"
 export const sessionStorageKey = "searchData"
 
 export function init(initState: InitState): State {
+  const locations = []
+  if (initState.initialValue) {
+    const location = initState.defaultLocations.find(
+      (loc) => loc.name.toLowerCase() === initState.initialValue!.toLowerCase()
+    )
+    if (location) {
+      locations.push(location)
+    }
+  }
   return {
     defaultLocations: initState.defaultLocations,
-    locations: [],
-    search: "",
-    searchData: undefined,
+    locations,
+    search: locations.length ? locations[0].name : "",
+    searchData: locations.length ? locations[0] : undefined,
     searchHistory: null,
   }
 }
@@ -73,8 +82,12 @@ export function reducer(state: State, action: Action) {
     case ActionType.SET_STORAGE_DATA: {
       return {
         ...state,
-        searchData: action.payload.searchData,
-        searchHistory: action.payload.searchHistory,
+        searchData: action.payload.searchData
+          ? action.payload.searchData
+          : state.searchData,
+        searchHistory: action.payload.searchHistory
+          ? action.payload.searchHistory
+          : state.searchHistory,
       }
     }
     default: