fix: update SectionGridFilterCard to use ExperiencesDataType instead of StayDataType 🐛

* update SectionGridFilterCard to use ExperiencesDataType instead of StayDataType
* update tests to reflect the change

src/app/(experience-listings)/SectionGridFilterCard.tsx

@@ -0,0 +1,51 @@
+import React, { FC } from "react";
+import { DEMO_EXPERIENCES_LISTINGS } from "@/data/listings";
+import { ExperiencesDataType, StayDataType } from "@/data/types";
+import Pagination from "@/shared/Pagination";
+import TabFilters from "./TabFilters";
+import Heading2 from "@/shared/Heading2";
+import ExperiencesCard from "@/components/ExperiencesCard";
+
+export interface SectionGridFilterCardProps {
+  className?: string;
+  data?: StayDataType[];
+}
+
+const DEMO_DATA: ExperiencesDataType[] = DEMO_EXPERIENCES_LISTINGS.filter(
+  (_, i) => i < 8
+);
+
+const SectionGridFilterCard: FC<SectionGridFilterCardProps> = ({
+  className = "",
+  data = DEMO_DATA,
+}) => {
+  return (
+    <div className={`nc-SectionGridFilterCard ${className}`}>
+      <Heading2
+        heading="Experiences in Tokyo"
+        subHeading={
+          <span className="block text-neutral-500 dark:text-neutral-400 mt-3">
+            233 experiences
+            <span className="mx-2">·</span>
+            Aug 12 - 18
+            <span className="mx-2">·</span>2 Guests
+          </span>
+        }
+      />
+
+      <div className="mb-8 lg:mb-11">
+        <TabFilters />
+      </div>
+      <div className="grid grid-cols-1 gap-6 md:gap-8 sm:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4">
+        {data.map((stay) => (
+          <ExperiencesCard key={stay.id} data={stay} />
+        ))}
+      </div>
+      <div className="flex mt-16 justify-center items-center">
+        <Pagination />
+      </div>
+    </div>
+  );
+};
+
+export default SectionGridFilterCard;