feat: add ui for stay card

components/MyPages/Blocks/Stays/StayCard/index.tsx

@@ -1,6 +1,6 @@
 import { dt } from "@/lib/dt"
 
-import { CalendarIcon } from "@/components/Icons"
+import { CalendarIcon, PersonIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Title from "@/components/TempDesignSystem/Text/Title"
@@ -32,15 +32,21 @@ export default function StayCard({ stay, lang }: StayCardProps) {
         <Title as="h5" className={styles.hotel} level="h3">
           {hotelInformation.hotelName}
         </Title>
-        <div className={styles.date}>
-          <CalendarIcon color="burgundy" />
-          <Caption asChild>
-            <time dateTime={arrivalDateTime}>{arrivalDate}</time>
-          </Caption>
-          {" - "}
-          <Caption asChild>
-            <time dateTime={departDateTime}>{departDate}</time>
-          </Caption>
+        <div className={styles.information}>
+          <div className={styles.date}>
+            <CalendarIcon color="burgundy" className={styles.icon} />
+            <Caption asChild>
+              <time dateTime={arrivalDateTime}>{arrivalDate}</time>
+            </Caption>
+            {" - "}
+            <Caption asChild>
+              <time dateTime={departDateTime}>{departDate}</time>
+            </Caption>
+          </div>
+          <div className={styles.guest}>
+            <PersonIcon color="burgundy" className={styles.icon} />
+            <Caption>2 guests</Caption>
+          </div>
         </div>
       </footer>
     </article>

components/MyPages/Blocks/Stays/StayCard/stay.module.css

@@ -32,8 +32,19 @@
   text-wrap: nowrap;
 }
 
-.date {
+.information {
+  display: flex;
+  gap: var(--Spacing-x2);
+}
+
+.date,
+.guest {
   align-items: center;
   display: flex;
   gap: var(--Spacing-x-half);
-}
+}
+
+.icon {
+  height: 1.5rem;
+  width: 1.5rem;
+}

components/MyPages/Blocks/Stays/Upcoming/EmptyUpcomingStays/index.tsx

@@ -2,7 +2,6 @@ import { homeHrefs } from "@/constants/homeHrefs"
 import { env } from "@/env/server"
 
 import { ArrowRightIcon } from "@/components/Icons"
-import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"