feat(dashboard): add Recording Assignments section

- Extend dashboard API to include recordingSuggestions for each event
- Add toBeRecorded and toRecord arrays with heat and user details
- Export RecordingSummaryCard component
- Add Recording Assignments section to DashboardPage
- Filter and display events with recording suggestions
- Show up to 2 suggestions per event with View Details link

frontend/src/pages/DashboardPage.jsx

@@ -10,6 +10,7 @@ import EmptyState from '../components/common/EmptyState';
 import {
   DashboardEventCard,
   DashboardMatchCard,
+  RecordingSummaryCard,
   IncomingRequestCard,
   OutgoingRequestCard,
 } from '../components/dashboard';
@@ -20,6 +21,7 @@ import {
   ChevronRight,
   Inbox,
   Send,
+  Video,
 } from 'lucide-react';
 
 const DashboardPage = () => {
@@ -159,6 +161,14 @@ const DashboardPage = () => {
   const hasIncoming = matchRequests?.incoming?.length > 0;
   const hasOutgoing = matchRequests?.outgoing?.length > 0;
 
+  // Filter events with recording suggestions
+  const eventsWithRecordings = activeEvents?.filter(
+    (event) =>
+      event.recordingSuggestions &&
+      (event.recordingSuggestions.toBeRecorded.length > 0 ||
+        event.recordingSuggestions.toRecord.length > 0)
+  ) || [];
+
   return (
     <Layout pageTitle="Dashboard">
       <div className="max-w-5xl mx-auto">
@@ -207,6 +217,24 @@ const DashboardPage = () => {
           )}
         </section>
 
+        {/* Recording Assignments Section */}
+        {eventsWithRecordings.length > 0 && (
+          <section className="mb-8">
+            <div className="flex items-center justify-between mb-4">
+              <h2 className="text-xl font-semibold text-gray-900 flex items-center gap-2">
+                <Video className="w-5 h-5 text-primary-600" />
+                Recording Assignments
+              </h2>
+            </div>
+
+            <div className="grid gap-4 md:grid-cols-2">
+              {eventsWithRecordings.map((event) => (
+                <RecordingSummaryCard key={event.id} event={event} />
+              ))}
+            </div>
+          </section>
+        )}
+
         {/* Active Matches Section */}
         <section className="mb-8">
           <div className="flex items-center justify-between mb-4">