fix: make contentKey type safe

components/TempDesignSystem/SidePeek/Container/index.tsx

@@ -4,6 +4,7 @@ import { usePathname, useRouter, useSearchParams } from "next/navigation"
 import React, { Children, cloneElement, useEffect, useState } from "react"
 
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
+import { SidePeekContentKey } from "@/components/TempDesignSystem/SidePeek/types"
 
 export default function SidePeekContainer({
   children,
@@ -11,14 +12,18 @@ export default function SidePeekContainer({
   const router = useRouter()
   const pathname = usePathname()
   const searchParams = useSearchParams()
-  const [activeSidePeek, setActiveSidePeek] = useState<string | null>(() => {
-    const sidePeekParam = searchParams.get("sidepeek")
-
-    return sidePeekParam || null
-  })
+  const [activeSidePeek, setActiveSidePeek] =
+    useState<SidePeekContentKey | null>(() => {
+      const sidePeekParam = searchParams.get(
+        "sidepeek"
+      ) as SidePeekContentKey | null
+      return sidePeekParam || null
+    })
 
   useEffect(() => {
-    const sidePeekParam = searchParams.get("sidepeek")
+    const sidePeekParam = searchParams.get(
+      "sidepeek"
+    ) as SidePeekContentKey | null
     if (sidePeekParam !== activeSidePeek) {
       setActiveSidePeek(sidePeekParam)
     }
@@ -39,7 +44,8 @@ export default function SidePeekContainer({
       return child
     }
     return cloneElement(child as React.ReactElement, {
-      isActive: child.props.contentKey === activeSidePeek,
+      isActive:
+        (child.props.contentKey as SidePeekContentKey) === activeSidePeek,
     })
   })
 

components/TempDesignSystem/SidePeek/data.ts

@@ -0,0 +1,5 @@
+import { SidePeekContentKey } from "./types"
+
+export const generateSidePeekLink = (key: SidePeekContentKey) => {
+  return `?sidepeek=${key}`
+}

components/TempDesignSystem/SidePeek/types.ts

@@ -1,3 +1,5 @@
+export type SidePeekContentKey = "amenities" | "read_more_about_the_hotel"
+
 export type SidePeekProps = {
   activeContent: string | null
   onClose: (isOpen: boolean) => void
@@ -5,7 +7,7 @@ export type SidePeekProps = {
 
 export type SidePeekContentProps = {
   title?: string
-  contentKey: string
+  contentKey: SidePeekContentKey
   isActive?: boolean
   onClose?: () => void
 }