import React, { useState } from "react";
import { useNavigate } from "react-router-dom"; // Import useNavigate for navigation
import FilterPage from "./FilterPage";
import "./WelcomeWithFilter.css";
import Footer from "./Footer";

const WelcomeWithFilter = () => {
  return (
    <div className="welcome-with-filter-container">
      {/* Filter Section */}
      <div className="filter-section">
        <FilterPage />
      </div>

      {/* Lower Section */}
      <div className="welcome-section">
        <div className="welcome-content">
          <div className="welcome-message">
            <h1>Appointment To Examiner</h1>
            <p>You’re signed in</p>
          </div>
          <div className="image-container">
            <img
              src="Somaiya.jpg"
              alt="Welcome Illustration"
              className="welcome-image"
            />
          </div>
        </div>
      </div>
      <Footer />
    </div>
  );
};

export default WelcomeWithFilter;
