Implementasi Backend pada login, FAQ, Settings Intern, Projects Intern, Home Intern

src/Pages/internify/intern/ProjectDetailPage.tsx

@@ -1,24 +1,20 @@
 import { useState } from 'react';
 import { useParams } from 'react-router-dom';
-import { mockProjects } from '../../../lib/mockProjects';
+import { useProjectDetail } from '../../../hooks/useProjectDetail';
 import ForumTab from './ForumTab';
 import ParticipantsTab from './ParticipantTab';
 
 const toSlug = (name: string) => name.toLowerCase().replace(/\s+/g, '-');
 
 export default function ProjectDetailPage() {
-  const { slug } = useParams<{ slug: string }>();
+  const { id } = useParams<{ id: string }>(); 
+  const { project, loading, error } = useProjectDetail(id ?? "");
   const [activeTab, setActiveTab] = useState<'forum' | 'participants'>('forum');
 
-  const project = mockProjects.find((p) => toSlug(p.name) === slug);
-
-  if (!project) {
-    return (
-      <div className="p-10 text-[#888]">
-        Project tidak ditemukan.
-      </div>
-    );
-  }
+  // Fallback sederhana
+  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