Featurebookingstate

src/components/Bookings/Bookings.jsx

@@ -1,17 +1,23 @@
+import React, { useState } from 'react';
 import Search from "@/components/Search/Search";
 import SearchResult from "../SearchResult/SearchResult";
+import FakeBookings from '@/data/fakeBookings.json';
+
 // import SearchResults from "@/componentsSearchResults.js";
 // import FakeBookings from "@/data/fakeBookings.json";
 
 const Bookings = () => {
+
+  const [bookings, setBookings] = useSatet(FakeBookings);
+
   const search = (searchVal) => {
     console.info("TO DO!", searchVal);
   };
 
   return (
     <main className="bookings">
       <Search search={search} />
-      <SearchResult />
+      <SearchResult bookings={bookings} />
     </main>
   );
 };

src/components/Bookings/Bookings.test.jsx

@@ -1,11 +1,11 @@
-import { describe, it, expect } from "vitest";
-import { render, screen } from "@testing-library/react";
-import Bookings from "./Bookings.jsx";
+import { describe, it, expect } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import Bookings from './Bookings.jsx';
 
-describe("Bookings Component", () => {
-  it("renders a main element", () => {
+describe('Bookings Component', () => {
+  it('renders a main element', () => {
     render(<Bookings />);
-    const mainElement = screen.getByRole("main");
+    const mainElement = screen.getByRole('main');
     expect(mainElement).toBeInTheDocument();
   });
 });