progress: breadcrumbs fixation, submission task fixation and add new UI after submitted, Certificates change layout and new page (Certificate List)

src/Pages/internify/Breadcumbs.tsx

@@ -1,14 +1,31 @@
 import { Link, useLocation } from "react-router-dom";
 import useBreadcrumbs from "use-react-router-breadcrumbs";
 import { ChevronRight } from "lucide-react";
+import { mockProjects } from "../../lib/mockData";
+
+const toSlug = (name: string) => name.toLowerCase().replace(/\s+/g, '-');
+
+// Dynamic breadcrumb: ubah slug jadi nama project asli
+const ProjectNameBreadcrumb = ({ match }: { match: { params: { slug?: string } } }) => {
+  const slug = match.params.slug;
+  const project = mockProjects.find((p) => toSlug(p.name) === slug);
+  return <>{project ? project.name : slug}</>;
+};
+
+const TaskNameBreadcrumb = ({ match }: { match: { params: { slug?: string; taskSlug?: string } } }) => {
+  const { slug, taskSlug } = match.params;
+  const project = mockProjects.find((p) => toSlug(p.name) === slug);
+  const task = project?.tasks.find((t) => toSlug(t.title) === taskSlug);
+  return <>{task ? task.title : taskSlug}</>;
+};
 
 const breadcrumbRoutes = [
   // --- AREA INTERN ---
   { path: '/intern', breadcrumb: 'Home' },
   { path: '/intern/projects', breadcrumb: 'Projects' },
-  { path: '/intern/projects/:id', breadcrumb: 'Forum' },
+  { path: '/intern/projects/:slug', breadcrumb: ProjectNameBreadcrumb },
   { path: '/intern/certificates', breadcrumb: 'Certificates' },
-  { path: '/intern/projects/:id/submit', breadcrumb: 'Submit Task' },
+  { path: '/intern/projects/:slug/:taskSlug', breadcrumb: TaskNameBreadcrumb  },
   { path: '/intern/faq', breadcrumb: 'FAQ' },
   { path: '/intern/notifications', breadcrumb: 'Notifications' },
   { path: '/intern/settings', breadcrumb: 'Settings' },
@@ -16,7 +33,7 @@ const breadcrumbRoutes = [
   // --- AREA MENTOR / ADMIN ---
   { path: '/mentor', breadcrumb: 'Home' },
   { path: '/mentor/projects', breadcrumb: 'List Projects' },
-  { path: '/mentor/projects/:id', breadcrumb: 'Forum' },
+  { path: '/mentor/projects/:slug', breadcrumb: ProjectNameBreadcrumb },
   { path: '/mentor/certificates', breadcrumb: 'Approve Certificates' },
   { path: '/mentor/intern', breadcrumb: 'List Intern' },
   { path: '/mentor/faq', breadcrumb: 'FAQ' },
@@ -28,7 +45,13 @@ export default function Breadcrumbs(){
   const breadcrumbs = useBreadcrumbs(breadcrumbRoutes);
   const location = useLocation();
 
-  const fixbreadcumbs = breadcrumbs.filter(({match}) => match.pathname !== '/');
+  const rootPaths = ['/intern', '/mentor'];
+  const isOnRootPath = rootPaths.includes(location.pathname);
+  const fixbreadcumbs = breadcrumbs.filter(({ match }) => {
+    if (match.pathname === '/') return false;
+    if (rootPaths.includes(match.pathname) && !isOnRootPath) return false;
+    return true;
+  });
   return (
     <nav className="text-[12px] mb-3">
       {fixbreadcumbs.map(({ match, breadcrumb }) => {