mirror of https://github.com/usememos/memos
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
32 lines
1.1 KiB
TypeScript
32 lines
1.1 KiB
TypeScript
import { Checkbox } from "@mui/joy";
|
|
import { useState } from "react";
|
|
import ResourceItemDropdown from "./ResourceItemDropdown";
|
|
|
|
const ResourceItem = ({ resource, handleCheckClick, handleUncheckClick }: ResourceItemType) => {
|
|
const [isSelected, setIsSelected] = useState<boolean>(false);
|
|
|
|
const handleSelectBtnClick = () => {
|
|
if (isSelected) {
|
|
handleUncheckClick();
|
|
} else {
|
|
handleCheckClick();
|
|
}
|
|
setIsSelected(!isSelected);
|
|
};
|
|
|
|
return (
|
|
<div key={resource.id} className="px-2 py-2 w-full grid grid-cols-10">
|
|
<span className="col-span-1 w-full flex justify-center m-auto truncate ">
|
|
<Checkbox checked={isSelected} onChange={handleSelectBtnClick} />
|
|
</span>
|
|
<span className="col-span-2 w-full m-auto truncate text-base pr-2">{resource.id}</span>
|
|
<span className="col-span-6 w-full m-auto truncate text-base pr-2">{resource.filename}</span>
|
|
<div className="col-span-1 w-full flex flex-row justify-end items-center pr-2">
|
|
<ResourceItemDropdown resource={resource} />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ResourceItem;
|