Kemas M. Aryadary Rasyad
e59e63a21e
- Removed unused imports and interfaces in HomeProjectList component. - Added ArrowDownNarrowWide icon to ProjectTimeline component for visual enhancement. - Updated layout imports to reflect new component structure. - Created BaseProjectsPage for mentor to manage projects with navigation. - Introduced MentorCertificatePage as a placeholder for future certificate functionality. - Deleted obsolete HomeMentorPage and replaced it with HomePage for mentor dashboard. - Added InternsPage and updated MentorInternPage for better intern management. - Implemented ProjectForumTab and ProjectsInternTab for project details and intern listings. - Developed TaskTab for task management within projects. - Created SidebarMentor for navigation in mentor dashboard. - Enhanced login functionality with user role-based navigation. - Updated mockData to include task submission counts and certificate data structure. - Added new assets for certificate representation.
63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import { Trash2, UsersRound } from 'lucide-react'
|
|
import type { Intern } from '../../../../lib/mockData'
|
|
import { useNavigate } from 'react-router-dom'
|
|
|
|
interface ProjectCardProps {
|
|
id: number | string
|
|
name: string
|
|
interns: Intern[]
|
|
thumbnailUrl?: string
|
|
}
|
|
|
|
export default function MentorProjectCard({
|
|
id,
|
|
name,
|
|
interns,
|
|
thumbnailUrl
|
|
}: ProjectCardProps) {
|
|
const navigate = useNavigate();
|
|
const handleCardClick = () => {
|
|
navigate(`/admin/projects/${id}`)
|
|
};
|
|
|
|
const handleDeleteClick = (e: React.MouseEvent<HTMLButtonElement>) => {
|
|
e.stopPropagation()
|
|
console.log('Delete project dengan id:', id)
|
|
}
|
|
return (
|
|
<div
|
|
onClick={handleCardClick}
|
|
className="flex flex-col bg-white rounded-xl overflow-hidden shadow-sm border border-gray-100 w-[180px] min-h-[270px]hover:bg-gray-50 transition-colors">
|
|
{/* Thumbnail */}
|
|
<div className="h-[150px] bg-gradient-to-tr from-red-700 to-red-800 overflow-hidden shrink-0">
|
|
{thumbnailUrl && (
|
|
<img src={thumbnailUrl} alt={name} className="w-full h-full object-cover" />
|
|
)}
|
|
</div>
|
|
|
|
{/* Content*/}
|
|
<div className="p-3 flex flex-col gap-2 flex-1 justify-between">
|
|
<div className="flex flex-col gap-1">
|
|
<p className="text-sm font-semibold text-gray-800 leading-tight line-clamp-2">
|
|
{name}
|
|
</p>
|
|
</div>
|
|
|
|
{/* Interns Count */}
|
|
<div className="flex items-center gap-2 mt-auto">
|
|
<UsersRound className='text-gray-400 w-4 h-4' />
|
|
<span className="text-xs text-gray-500 truncate">
|
|
{interns.length}/{interns.length}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Footer */}
|
|
<div className="border-t border-gray-300 text-gray-400 flex justify-end p-2 bg-gray-50/50">
|
|
<button onClick={handleDeleteClick} className="hover:text-red-600 transition-colors">
|
|
<Trash2 className="w-4 h-4" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
)
|
|
} |