58 lines
1.4 KiB
JavaScript
58 lines
1.4 KiB
JavaScript
"use client";
|
|
import { useState, useEffect } from "react";
|
|
import ItemTitle from "./ItemTitle";
|
|
import { request } from "@/services/response";
|
|
|
|
function Title({ onTagChange }) {
|
|
const [activeBtn, setActiveBtn] = useState(0);
|
|
const [tags, setTags] = useState([]);
|
|
|
|
useEffect(() => {
|
|
const fetchTags = async () => {
|
|
try {
|
|
const params = {
|
|
page: 1,
|
|
limit: 100,
|
|
};
|
|
const response = await request.getBlogTags(params);
|
|
setTags(response?.data?.data || []);
|
|
} catch (error) {
|
|
console.error("Error fetching tags:", error);
|
|
setTags([]);
|
|
}
|
|
};
|
|
|
|
fetchTags();
|
|
}, []);
|
|
|
|
const handleTagClick = (idx, tagId) => {
|
|
setActiveBtn(idx);
|
|
if (onTagChange) {
|
|
onTagChange(tagId);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<ul className="flex w-full overflow-auto hidden-scroll items-center justify-start gap-[8px] sm:gap-[10px] md:gap-[13px] lg:gap-[16px]">
|
|
<ItemTitle
|
|
setActiveBtn={() => handleTagClick(0, null)}
|
|
activeBtn={activeBtn}
|
|
name="همه"
|
|
idx={0}
|
|
key="all"
|
|
/>
|
|
{tags.map((tag, idx) => (
|
|
<ItemTitle
|
|
setActiveBtn={() => handleTagClick(idx + 1, tag.id)}
|
|
activeBtn={activeBtn}
|
|
name={tag.name}
|
|
idx={idx + 1}
|
|
key={tag.uuid}
|
|
/>
|
|
))}
|
|
</ul>
|
|
);
|
|
}
|
|
|
|
export default Title;
|