feat: add email, scheduler, and Zulip integration services

- Add email service for sending meeting invites with ICS attachments
- Add scheduler for background calendar sync jobs
- Add Zulip service for meeting notifications
- Make ics_url optional for participants
- Add /api/schedule endpoint with 2-hour lead time validation
- Update frontend to support scheduling flow

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/components/AvailabilityHeatmap.tsx

@@ -8,9 +8,23 @@ import {
 import { Button } from '@/components/ui/button';
 import { Check, X, Loader2 } from 'lucide-react';
 
-const days = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'];
+const dayNames = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'];
 const hours = [9, 10, 11, 12, 13, 14, 15, 16, 17];
 
+// Get the dates for Mon-Fri of the current week
+const getWeekDates = () => {
+  const now = new Date();
+  const monday = new Date(now);
+  monday.setDate(now.getDate() - now.getDay() + 1);
+  monday.setHours(0, 0, 0, 0);
+
+  return dayNames.map((_, i) => {
+    const date = new Date(monday);
+    date.setDate(monday.getDate() + i);
+    return date.toISOString().split('T')[0]; // "YYYY-MM-DD"
+  });
+};
+
 interface AvailabilityHeatmapProps {
   slots: TimeSlot[];
   selectedParticipants: Participant[];
@@ -26,8 +40,10 @@ export const AvailabilityHeatmap = ({
   showPartialAvailability = false,
   isLoading = false,
 }: AvailabilityHeatmapProps) => {
-  const getSlot = (day: string, hour: number) => {
-    return slots.find((s) => s.day === day && s.hour === hour);
+  const weekDates = getWeekDates();
+
+  const getSlot = (dateStr: string, hour: number) => {
+    return slots.find((s) => s.day === dateStr && s.hour === hour);
   };
 
   const getEffectiveAvailability = (slot: TimeSlot) => {
@@ -41,6 +57,13 @@ export const AvailabilityHeatmap = ({
     return `${hour.toString().padStart(2, '0')}:00`;
   };
 
+  const isSlotTooSoon = (dateStr: string, hour: number) => {
+    const slotTime = new Date(`${dateStr}T${formatHour(hour)}:00Z`);
+    const now = new Date();
+    const twoHoursFromNow = new Date(now.getTime() + 2 * 60 * 60 * 1000);
+    return slotTime < twoHoursFromNow;
+  };
+
   const getWeekDateRange = () => {
     const now = new Date();
     const monday = new Date(now);
@@ -87,12 +110,12 @@ export const AvailabilityHeatmap = ({
         <div className="min-w-[600px]">
           <div className="grid grid-cols-[60px_repeat(5,1fr)] gap-1 mb-2">
             <div></div>
-            {days.map((day) => (
+            {dayNames.map((dayName) => (
               <div
-                key={day}
+                key={dayName}
                 className="text-center text-sm font-medium text-muted-foreground py-2"
               >
-                {day}
+                {dayName}
               </div>
             ))}
           </div>
@@ -103,18 +126,22 @@ export const AvailabilityHeatmap = ({
                 <div className="text-xs text-muted-foreground flex items-center justify-end pr-3">
                   {formatHour(hour)}
                 </div>
-                {days.map((day) => {
-                  const slot = getSlot(day, hour);
-                  if (!slot) return <div key={`${day}-${hour}`} className="h-12 bg-muted rounded" />;
+                {weekDates.map((dateStr, dayIndex) => {
+                  const slot = getSlot(dateStr, hour);
+                  const dayName = dayNames[dayIndex];
+                  const tooSoon = isSlotTooSoon(dateStr, hour);
+                  if (!slot) return <div key={`${dateStr}-${hour}`} className="h-12 bg-muted rounded" />;
 
                   const effectiveAvailability = getEffectiveAvailability(slot);
 
                   return (
-                    <Popover key={`${day}-${hour}`}>
+                    <Popover key={`${dateStr}-${hour}`}>
                       <PopoverTrigger asChild>
                         <button
                           className={cn(
-                            "h-12 rounded-md transition-all duration-200 hover:scale-105 hover:shadow-md focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+                            "h-12 rounded-md transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+                            tooSoon && "opacity-40 cursor-not-allowed",
+                            !tooSoon && "hover:scale-105 hover:shadow-md",
                             effectiveAvailability === 'full' && "bg-availability-full hover:bg-availability-full/90",
                             effectiveAvailability === 'partial' && "bg-availability-partial hover:bg-availability-partial/90",
                             effectiveAvailability === 'none' && "bg-availability-none hover:bg-availability-none/90"
@@ -124,8 +151,13 @@ export const AvailabilityHeatmap = ({
                       <PopoverContent className="w-64 p-4 animate-scale-in" align="center">
                         <div className="space-y-3">
                           <div className="font-semibold text-foreground">
-                            {day} {formatHour(hour)}–{formatHour(hour + 1)}
+                            {dayName} {formatHour(hour)}–{formatHour(hour + 1)}
                           </div>
+                          {tooSoon && (
+                            <div className="text-sm text-muted-foreground italic">
+                              This time slot has passed or is too soon to schedule
+                            </div>
+                          )}
                           <div className="space-y-2">
                             {selectedParticipants.map((participant) => {
                               const isAvailable = slot.availableParticipants.includes(participant.name);
@@ -148,7 +180,7 @@ export const AvailabilityHeatmap = ({
                               );
                             })}
                           </div>
-                          {effectiveAvailability !== 'none' && (
+                          {effectiveAvailability !== 'none' && !tooSoon && (
                             <Button
                               variant="schedule"
                               className="w-full mt-2"