Toast Implementation; fix add interns dialogue: penghapusan UI delete pada dialog komponen; penambahan params pada generate sertificate; perubahan tipe state untuk submission (user bisa open file submission)

src/Pages/internify/intern/ForumTab.tsx

@@ -6,37 +6,44 @@ import type { Project } from '../../../types/project.types';
 
 export default function ForumTab({ project }: { project: Project }) {
   const { tasks, loading, error } = useProjectMyTasks(project.id);
+
   return (
     <div>
       <HeroProject title={project.project_name} description={project.description} />
 
-      {/* Loading */}
-      {loading && (
+      {/* Loading skeleton */}
+      {/* {loading && (
         <div className="flex flex-col gap-3 mt-5">
           {[...Array(3)].map((_, i) => (
             <div key={i} className="h-24 bg-gray-100 rounded-xl animate-pulse" />
           ))}
         </div>
-      )}
+      )} */}
 
       {/* Error */}
       {error && <p className="text-red-500 text-sm mt-5">{error}</p>}
 
-      {/* Timeline + Task list */}
-      <div className="flex flex-col gap-7 md:flex-row md:items-start">
-        <div className="w-full md:w-1/5 bg-white rounded-xl p-5 border border-box-border shrink-0">
-          <ProjectTimeline tasks={tasks} />
-        </div>
-        <div className="w-full border-t border-box-border md:border-t-0 pt-4 md:pt-0 md:w-4/5">
-          {tasks.length === 0 ? (
-            <p className="text-sm text-gray-400">Belum ada task.</p>
-          ) : (
-            tasks.map((task) => (
-              <TaskCard key={task.id} task={task} />
-            ))
-          )}
-        </div>
-      </div>
+      {/* Timeline + Task list — hanya tampil jika ada task */}
+      {/* {!loading && tasks.length === 0 ? ( */}
+      {tasks.length === 0 ? (
+        <p className="text-md text-font-shade mt-5">Belum ada tugas yang dapat dikerjakan.</p>
+      ) : (
+        !loading && (
+          <div className="flex flex-col gap-7 md:flex-row md:items-start mt-5">
+            {/* Kolom kiri: Timeline */}
+            <div className="w-full md:w-1/5 bg-white rounded-xl p-5 border border-box-border shrink-0">
+              <ProjectTimeline tasks={tasks} />
+            </div>
+
+            {/* Kolom kanan: Task cards */}
+            <div className="w-full border-t border-box-border md:border-t-0 pt-4 md:pt-0 md:w-4/5">
+              {tasks.map((task) => (
+                <TaskCard key={task.id} task={task} />
+              ))}
+            </div>
+          </div>
+        )
+      )}
     </div>
   );
-}
+}