feat(home): split Active and Past products into distinct sections

app/page.tsx

@@ -15,6 +15,18 @@ const SORTED_PROJECTS = [...PROJECTS].sort((a, b) => {
   return Number(b.since) - Number(a.since)
 })
 
+type Project = (typeof PROJECTS)[number]
+const ACTIVE_PROJECTS = SORTED_PROJECTS.filter((p) => p.status !== "Deprecated")
+const PAST_PROJECTS = SORTED_PROJECTS.filter((p) => p.status === "Deprecated")
+
+const ProductGrid = ({ projects, className = "" }: { projects: Project[]; className?: string }) => (
+  <div className={className}>
+    {projects.map((project) => (
+      <ProjectCard key={project.slug} {...project} />
+    ))}
+  </div>
+)
+
 export default function ReportsIndexPage() {
   return (
     <div className="min-h-screen bg-background">
@@ -97,24 +109,18 @@ export default function ReportsIndexPage() {
           <h2 className="text-xl font-semibold text-foreground">Products</h2>
         </div>
 
-        {/* Project cards */}
-        <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-4">
-          {SORTED_PROJECTS.map((project) => (
-            <ProjectCard
-              key={project.slug}
-              slug={project.slug}
-              name={project.name}
-              tagline={project.tagline}
-              status={project.status}
-              since={project.since}
-              audience={project.audience}
-              contributors={project.contributors}
-              volunteers={project.volunteers}
-              highlightStat={project.highlightStat}
-              url={project.url}
-            />
-          ))}
-        </div>
+        {/* Active products */}
+        <ProductGrid projects={ACTIVE_PROJECTS} className="grid md:grid-cols-2 lg:grid-cols-3 gap-4" />
+
+        {/* Past products */}
+        {PAST_PROJECTS.length > 0 && (
+          <>
+            <h3 className="mt-12 text-base font-semibold text-muted-foreground mb-6">
+              Past products
+            </h3>
+            <ProductGrid projects={PAST_PROJECTS} className="grid md:grid-cols-2 lg:grid-cols-3 gap-4" />
+          </>
+        )}
       </main>
 
       {/* Footer */}

lib/data.ts

@@ -202,6 +202,34 @@ export const PROJECTS: Project[] = [
       },
     ],
   },
+  {
+    slug: "chergpt",
+    volunteers: 4,
+    name: "CherGPT",
+    tagline: "GPT-powered teaching assistant.",
+    description:
+      "CherGPT is a GPT-powered teaching assistant built for educators and students. The project is no longer actively maintained and is kept here as a past product.",
+    url: "https://github.com/String-sg/chergpt-basic",
+    status: "Deprecated",
+    since: "2024",
+    audience: ["Teachers", "Students"],
+    problemSpace: ["Learning"],
+    contributors: [
+      // TODO: add real contributor names
+    ],
+    highlightStat: { value: "1,000+", label: "users" },
+    metrics: [
+      { label: "Total users", value: "1,000+" },
+      { label: "Volunteers", value: "4" },
+    ],
+    costPerQuarter: "$0",
+    updates: [
+      {
+        date: "2026",
+        body: "Moved to inactive status. No active feature development or maintenance.",
+      },
+    ],
+  },
   {
     slug: "events",
     volunteers: 10,
@@ -313,7 +341,7 @@ export const PROJECTS: Project[] = [
 ]
 
 export const AGGREGATE = {
-  // Active: String (Building), Events (Building), Diagrams (Building), Bingo (Maintenance), MatCHER (Building). Remarks Co-Pilot and Whine deprecated.
+  // Active: String (Building), Events (Building), Diagrams (Building), Bingo (Maintenance), MatCHER (Building). Remarks Co-Pilot, Whine, and CherGPT are deprecated.
   totalProjects: 5,
   // Auto-computed: sum of teacherImpact across all projects.
   // To update, set teacherImpact on the relevant project above.