43 lines
1.3 KiB
JavaScript
43 lines
1.3 KiB
JavaScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import List from "./list";
|
|
import SmSearch from "../searchHead/SmSearch";
|
|
import HeadPageList from "@/app/component/head";
|
|
import specialtiesData from "@/data/specialties.json";
|
|
|
|
function SpecialtiesPage() {
|
|
const [searchQuery, setSearchQuery] = useState("");
|
|
const [filteredSpecialties, setFilteredSpecialties] = useState(specialtiesData);
|
|
|
|
useEffect(() => {
|
|
if (searchQuery.trim() === "") {
|
|
setFilteredSpecialties(specialtiesData);
|
|
} else {
|
|
const query = searchQuery.toLowerCase().trim();
|
|
const filtered = specialtiesData.filter((specialty) =>
|
|
specialty.name.toLowerCase().includes(query)
|
|
);
|
|
setFilteredSpecialties(filtered);
|
|
}
|
|
}, [searchQuery]);
|
|
|
|
const handleSearch = (query) => {
|
|
setSearchQuery(query);
|
|
};
|
|
|
|
return (
|
|
<div className="">
|
|
<HeadPageList
|
|
title="تخصص مورد نظر شما چیست؟"
|
|
detail="تخصص مورد نظرتان را جستجو کرده و یا از لیست زیر انتخاب نمایید:"
|
|
>
|
|
<SmSearch placeholder="جستجوی تخصص" onSearch={handleSearch} />
|
|
</HeadPageList>
|
|
<List specialties={filteredSpecialties} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default SpecialtiesPage;
|