sulthan/internify-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add modals for managing interns, creating projects, and tasks

Browse Source 
- Implemented AddInternsDialog for inviting and managing interns.
- Created CreateProjectDialog for launching new projects with detailed forms.
- Added CreateTaskDialog for task creation with deadline and submission type options.
- Enhanced Header component with navigation functionality.
- Updated MentorProjectCard to navigate correctly to mentor projects.
- Refactored SidebarMentor for improved navigation and mobile responsiveness.
- Adjusted Internify login logic to streamline user role navigation.
- Added CSS styles for consistent layout and design.
- Introduced mock data for interns to facilitate development and testing.
This commit is contained in:
Kemas M. Aryadary Rasyad
2026-06-06 23:47:22 +07:00
parent e59e63a21e
commit 46cd26f4d2
33 changed files with 1886 additions and 332 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/Pages/internify/intern/components/ProjectsCard.tsx
+33 -30
View File
@@ -24,7 +24,7 @@ const ProjectCard = ({
const navigate = useNavigate()
return (
<div className="bg-white rounded-xl overflow-hidden shadow-sm border border-gray-100 w-[260px] flex flex-col">
<div className="bg-white rounded-xl overflow-hidden shadow-sm border border-gray-100 w-[230px] flex flex-col">
{/* Thumbnail */}
<div className="h-[150px] bg-gradient-to-tr from-red-700 to-red-800 overflow-hidden">
{thumbnailUrl && (
@@ -33,41 +33,44 @@ const ProjectCard = ({
</div>
{/* Content */}
<div className="p-3 flex flex-col gap-2">
<p className="text-sm font-semibold text-gray-800 leading-tight">{name}</p>
<div className="min-h-[180px] max-h-[210px] flex-1 flex flex-col justify-between py-3">
<div className="px-3 flex flex-col gap-2">
<p className="text-sm font-semibold text-gray-800 leading-tight">{name}</p>
{/* Mentor */}
<div className="flex items-center gap-2">
<div className="w-6 h-6 rounded-full bg-gray-200 overflow-hidden flex-shrink-0">
{avatarUrl ? (
<img src={avatarUrl} alt={mentor} className="w-full h-full object-cover" />
) : (
<div className="w-full h-full bg-gray-300" />
)}
{/* Mentor */}
<div className="flex items-center gap-2">
<div className="w-6 h-6 rounded-full bg-gray-200 overflow-hidden flex-shrink-0">
{avatarUrl ? (
<img src={avatarUrl} alt={mentor} className="w-full h-full object-cover" />
) : (
<div className="w-full h-full bg-gray-300" />
)}
</div>
<span className="text-xs text-gray-500 truncate">{mentor}</span>
</div>
<span className="text-xs text-gray-500 truncate">{mentor}</span>
</div>
{/* Progress bar */}
<div className="flex flex-col gap-1">
<div className="w-full h-1.5 bg-gray-200 rounded-full overflow-hidden">
<div
className="h-full bg-red-600 rounded-full transition-all duration-300"
style={{ width: `${progress}%` }}
/>
{/* Progress bar */}
<div className="flex flex-col gap-1">
<div className="w-full h-1.5 bg-gray-200 rounded-full overflow-hidden">
<div
className="h-full bg-red-600 rounded-full transition-all duration-300"
style={{ width: `${progress}%` }}
/>
</div>
<span className="text-[10px] text-gray-400 text-right">
{tasksDone}/{tasksTotal}
</span>
</div>
<span className="text-[10px] text-gray-400 text-right">
{tasksDone}/{tasksTotal}
</span>
</div>
{/* Button */}
<button
onClick={() => navigate(`/intern/projects/${id}`)}
className="w-full bg-red-600 hover:bg-red-700 text-white text-xs font-medium py-1.5 rounded-lg transition-colors"
>
View Project
</button>
<div className="flex items-end justify-end px-3 pb-1">
<button
onClick={() => navigate(`/intern/projects/${id}`)}
className="bg-red-600 hover:bg-red-700 text-white text-xs font-medium py-1.5 px-3 rounded-xl transition-colors"
>
View Project
</button>
</div>
</div>
</div>
)