36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
import { Button } from "@/components/ui/button";
|
|
import { ChevronLeft, ChevronRight } from "lucide-react";
|
|
import React from "react";
|
|
|
|
const ChevronToggle = (props: {
|
|
isMemoriesExpanded: boolean;
|
|
setIsMemoriesExpanded: React.Dispatch<React.SetStateAction<boolean>>;
|
|
}) => {
|
|
const { isMemoriesExpanded, setIsMemoriesExpanded } = props;
|
|
return (
|
|
<>
|
|
<div className="relaive">
|
|
<div className="flex items-center absolute top-1/2 z-10">
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-8 w-8 border-y border rounded-lg relative right-10"
|
|
onClick={() => setIsMemoriesExpanded(!isMemoriesExpanded)}
|
|
aria-label={
|
|
isMemoriesExpanded ? "Collapse memories" : "Expand memories"
|
|
}
|
|
>
|
|
{isMemoriesExpanded ? (
|
|
<ChevronRight className="h-4 w-4" />
|
|
) : (
|
|
<ChevronLeft className="h-4 w-4" />
|
|
)}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ChevronToggle;
|