45 lines
1.3 KiB
JavaScript
45 lines
1.3 KiB
JavaScript
import { useContext, useEffect, useRef } from "react";
|
|
import { Button } from "../ui/button";
|
|
import CanvasContext from "../Context/canvasContext/CanvasContext";
|
|
import { X } from "lucide-react";
|
|
import { ScrollArea } from "../ui/scroll-area";
|
|
import AllIconsPage from "../EachComponent/Icons/AllIcons";
|
|
import { useParams } from "react-router-dom";
|
|
import useProject from "@/hooks/useProject";
|
|
|
|
const IconPanel = () => {
|
|
const { setSelectedPanel } = useContext(CanvasContext);
|
|
|
|
const params = useParams();
|
|
const { id } = params;
|
|
const { createEmptyProject } = useProject();
|
|
const hasCreatedProject = useRef(false);
|
|
|
|
useEffect(() => {
|
|
if (!id && !hasCreatedProject.current) {
|
|
createEmptyProject();
|
|
hasCreatedProject.current = true; // Prevent further calls
|
|
}
|
|
}, [id, createEmptyProject]);
|
|
|
|
return (
|
|
<div>
|
|
<div className="flex justify-between items-center p-4 border-b">
|
|
<h2 className="text-lg font-semibold">Icons</h2>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
onClick={() => setSelectedPanel("")}
|
|
>
|
|
<X className="h-4 w-4" />
|
|
</Button>
|
|
</div>
|
|
|
|
<ScrollArea className="md:h-[calc(90vh-190px)] px-4 py-4">
|
|
<AllIconsPage />
|
|
</ScrollArea>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default IconPanel;
|