Kemas M. Aryadary Rasyad
ad26a53f21
fix: update project card to reflect actual tasks done from project data feat: enhance task form components to accept project ID for submissions refactor: clean up certificate detail page by removing unused elements chore: streamline certificate generation page by removing unnecessary navigation refactor: update certificate list page to use dynamic project data feat: improve interns management page with API integration and better state handling feat: add modal for assigning interns to projects with project selection feat: create a new component for displaying project cards in certificate list fix: correct import paths in create project dialog component refactor: enhance project hooks to include task filtering and refetch capabilities fix: update mock certificate data to reflect correct status feat: extend certificate types to include new fields for better tracking feat: add task_done field to project types for improved task management
44 lines
1.6 KiB
TypeScript
44 lines
1.6 KiB
TypeScript
import { useState } from 'react';
|
|
import { useParams } from 'react-router-dom';
|
|
import { useProjectDetail } from '../../../hooks/useProjects';
|
|
import ForumTab from './ForumTab';
|
|
import ParticipantsTab from './ParticipantTab';
|
|
|
|
export default function ProjectDetailPage() {
|
|
const { slug } = useParams<{ slug: string }>();
|
|
const { project, loading, error } = useProjectDetail(slug ?? "");
|
|
const [activeTab, setActiveTab] = useState<'forum' | 'participants'>('forum');
|
|
|
|
if (loading) return <p className="p-10 text-gray-400">Memuat project...</p>;
|
|
if (error) return <p className="p-10 text-red-500">{error}</p>;
|
|
|
|
if (!project) return <p className="p-10 text-gray-400">Project tidak ditemukan.</p>;
|
|
|
|
const tabClass = (tab: string) =>
|
|
`pr-0 py-2.5 mr-7 text-sm bg-transparent border-0 cursor-pointer transition-colors duration-150 border-b-2 ${activeTab === tab
|
|
? 'font-bold text-[#C0392B] border-[#C0392B]'
|
|
: 'font-medium text-[#666] border-transparent'
|
|
}`;
|
|
|
|
return (
|
|
<div>
|
|
<div>
|
|
{/* Tabs */}
|
|
<div className="flex mb-4 border-b border-card-outline">
|
|
<button className={tabClass('forum')} onClick={() => setActiveTab('forum')}>
|
|
Forum
|
|
</button>
|
|
<button className={tabClass('participants')} onClick={() => setActiveTab('participants')}>
|
|
Participants
|
|
</button>
|
|
</div>
|
|
|
|
{/* Tab content */}
|
|
{activeTab === 'forum'
|
|
? <ForumTab project={project} />
|
|
: <ParticipantsTab project={project} />
|
|
}
|
|
</div>
|
|
</div>
|
|
);
|
|
} |