Adjusted

src/modules/admin/config/courses/columns.config.jsx

@@ -1,38 +1,70 @@
+// config/columns.config.jsx
+// Column definitions and pinning config for the Users table.
+
+import { buildColumns } from "@/utils/table.util";
+import { buildSelectionColumn } from "@/components/generic/Table/buildSelectionColumn";
+import { buildRowActionsColumn } from "@/components/generic/Table/buildRowActionsColumn";
 import { Badge } from "@/components/ui/badge";
+import { Book, BookOpenCheck, Clock } from "lucide-react";
+import { formatDuration } from "@/utils/timestamp.util";
 
 export const columnPinning = {
-  left: ["select", "title"],
   right: ["actions"],
+  left: [],
 };
 
-export function buildDataColumns(attributes, rowActions) {
-  const base = [
-    {
-      accessorKey: "title",
-      header: "Title",
-      cell: ({ row }) => (
-        <span className="font-medium">{row.original.title}</span>
-      ),
-    },
-    {
-      accessorKey: "description",
-      header: "Description",
-      cell: ({ row }) => (
-        <span className="text-muted-foreground text-sm truncate max-w-xs block">
-          {row.original.description ?? "—"}
-        </span>
-      ),
-    },
-    {
-      accessorKey: "order",
-      header: "Order",
-      cell: ({ row }) => (
-        <Badge variant="outline" className="text-xs">
-          {row.original.order}
-        </Badge>
-      ),
-    },
-  ];
 
-  return rowActions ? [...base, rowActions] : base;
-}
+// ─── Custom cell overrides ────────────────────────────────────────────────────
+const cellOverrides = {
+  unitCount: (info) => {
+    const count = parseInt(info.getValue() ?? 0, 10);
+    return (
+      <div className="flex items-center gap-1.5">
+        <Book className="h-3.5 w-3.5 text-muted-foreground" />
+        <Badge variant="secondary" className="text-xs font-medium tabular-nums">
+          {count} {count === 1 ? "unit" : "units"}
+        </Badge>
+      </div>
+    );
+  },
+  lessonCount: (info) => {
+    const count = parseInt(info.getValue() ?? 0, 10);
+    return (
+      <div className="flex items-center gap-1.5">
+        <BookOpenCheck className="h-3.5 w-3.5 text-muted-foreground" />
+        <Badge variant="secondary" className="text-xs font-medium tabular-nums">
+          {count} {count === 1 ? "lesson" : "lessons"}
+        </Badge>
+      </div>
+    );
+  },
+  duration_seconds: (info) => {
+    const seconds = parseInt(info.getValue() ?? 0, 10);
+
+    return (
+      <div className="flex items-center gap-1.5">
+        <Clock className="h-3.5 w-3.5 text-muted-foreground" />
+        <Badge variant="secondary" className="text-xs font-medium tabular-nums">
+          {formatDuration(seconds)}
+        </Badge>
+      </div>
+    );
+  },
+};
+
+/**
+ * Builds the full column array for the Users table.
+ *
+ * @param {Array}    attributes  Field definitions from the server (drives data columns)
+ * @param {Array}    rowActions  Row-level kebab action definitions
+ * @returns {Array}              TanStack column definitions
+ */
+export function buildDataColumns(attributes, rowActions) {
+  const visibleAttributes = attributes.filter((a) => !a.hidden);
+
+  return [
+    buildSelectionColumn(),
+    ...buildColumns(visibleAttributes, { cellOverrides }),
+    buildRowActionsColumn(rowActions, { dropdownLabel: "Course Actions" }),
+  ];
+}