Merged in feat/SW-3289-replace-sidepeek-hotel-reservation (pull request #2686)

feat(SW-3289): replace sidepeek

* fix(SW-3289): replace sidepeek

* fix(SW-3289): add wrapping prop and change prop name to buttonVariant

* fix(SW-3289): replace body with typography

* fix(SW-3289): fix intl message


Approved-by: Joakim Jäderberg

apps/scandic-web/components/HotelReservation/MyStay/Rooms/SingleRoom/RoomDetailsSidePeek.tsx

@@ -9,7 +9,9 @@ import { OldDSButton as Button } from "@scandic-hotels/design-system/OldDSButton
 import { useMyStayStore } from "@/stores/my-stay"
 
 import BookedRoomSidePeek from "@/components/SidePeeks/BookedRoomSidePeek"
+import { trackOpenSidePeekEvent } from "@/utils/tracking"
 
+import { SidePeekEnum } from "@/types/sidepeek"
 import type { SafeUser } from "@/types/user"
 
 interface RoomDetailsSidePeekProps {
@@ -21,9 +23,23 @@ export default function RoomDetailsSidePeek({
 }: RoomDetailsSidePeekProps) {
   const intl = useIntl()
   const bookedRoom = useMyStayStore((state) => state.bookedRoom)
+
   return (
     <DialogTrigger>
-      <Button intent="text" size="small" theme="base" variant="icon" wrapping>
+      <Button
+        intent="text"
+        size="small"
+        theme="base"
+        variant="icon"
+        wrapping
+        onPress={() => {
+          trackOpenSidePeekEvent({
+            name: SidePeekEnum.bookedRoomDetails,
+            hotelId: bookedRoom.hotelId,
+            includePathname: true,
+          })
+        }}
+      >
         {intl.formatMessage({ defaultMessage: "See room details" })}
         <MaterialIcon icon="chevron_right" size={14} color="CurrentColor" />
       </Button>