feat: static my stays

components/MyPages/Blocks/Overview/UpcomingStays/index.tsx

@@ -0,0 +1,38 @@
+import { serverClient } from "@/lib/trpc/server"
+
+import Link from "@/components/TempDesignSystem/Link"
+import Title from "@/components/MyPages/Title"
+import StayCard from "../../Stays/StayCard"
+import EmptyUpcomingStaysBlock from "../../Stays/EmptyUpcomingStays"
+
+import styles from "./upcoming.module.css"
+
+import type { LangParams } from "@/types/params"
+
+export default async function UpcomingStays({ lang }: LangParams) {
+  const stays = await serverClient().user.stays.upcoming({
+    perPage: 3,
+  })
+
+  return (
+    <section className={styles.container}>
+      <header className={styles.header}>
+        <Title level="h2" as="h5" uppercase>
+          Your upcoming stays
+        </Title>
+        <Link className={styles.link} href="#">
+          See all
+        </Link>
+      </header>
+      {stays.length ? (
+        <section className={styles.stays}>
+          {stays.map((stay) => (
+            <StayCard key={stay.uid} stay={stay} lang={lang} />
+          ))}
+        </section>
+      ) : (
+        <EmptyUpcomingStaysBlock />
+      )}
+    </section>
+  )
+}