30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
import useModalStore from "../stores/useModalStore";
|
||
import { Session } from "../types/ISession";
|
||
import SessionModal from "./modals/SessionModal";
|
||
|
||
function SessionCard({ session }: { session: Session }) {
|
||
const { setModal, setPosition } = useModalStore();
|
||
return (
|
||
<div
|
||
className="w-full h-[4.444vw] border-b-1 first:border-t-1 border-[#F6F6F6] flex py-[0.278vw] items-center gap-[0.556vw] cursor-pointer group"
|
||
onClick={() => {
|
||
setModal(<SessionModal session={session} />);
|
||
setPosition("right");
|
||
}}
|
||
>
|
||
<div className="rounded-[1.111vw] w-full h-full flex items-center gap-[0.556vw] group-hover:bg-[#F6F6F6] transition-colors duration-200 px-[1.111vw] py-[0.972vw]">
|
||
<div className="size-[2.5vw] bg-[#F6F6F6] rounded-full"></div>
|
||
<div className="flex flex-col w-full gap-[0.278vw]">
|
||
<p className="button-m font-medium">{session.owner.fullname}</p>
|
||
<p className="caption-s font-medium text-[#7D7D7D]">
|
||
Клиент: {session.client.name} •
|
||
{session.app.name}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export default SessionCard;
|