Update site changes

frontend/src/app/admin/events/page.tsx

@@ -34,6 +34,8 @@ export default function AdminEventsPage() {
     capacity: number;
     status: 'draft' | 'published' | 'cancelled' | 'completed' | 'archived';
     bannerUrl: string;
+    externalBookingEnabled: boolean;
+    externalBookingUrl: string;
   }>({
     title: '',
     titleEs: '',
@@ -48,6 +50,8 @@ export default function AdminEventsPage() {
     capacity: 50,
     status: 'draft',
     bannerUrl: '',
+    externalBookingEnabled: false,
+    externalBookingUrl: '',
   });
 
   useEffect(() => {
@@ -80,6 +84,8 @@ export default function AdminEventsPage() {
       capacity: 50,
       status: 'draft' as const,
       bannerUrl: '',
+      externalBookingEnabled: false,
+      externalBookingUrl: '',
     });
     setEditingEvent(null);
   };
@@ -99,6 +105,8 @@ export default function AdminEventsPage() {
       capacity: event.capacity,
       status: event.status,
       bannerUrl: event.bannerUrl || '',
+      externalBookingEnabled: event.externalBookingEnabled || false,
+      externalBookingUrl: event.externalBookingUrl || '',
     });
     setEditingEvent(event);
     setShowForm(true);
@@ -109,6 +117,18 @@ export default function AdminEventsPage() {
     setSaving(true);
 
     try {
+      // Validate external booking URL if enabled
+      if (formData.externalBookingEnabled && !formData.externalBookingUrl) {
+        toast.error('External booking URL is required when external booking is enabled');
+        setSaving(false);
+        return;
+      }
+      if (formData.externalBookingEnabled && !formData.externalBookingUrl.startsWith('https://')) {
+        toast.error('External booking URL must be a valid HTTPS link');
+        setSaving(false);
+        return;
+      }
+
       const eventData = {
         title: formData.title,
         titleEs: formData.titleEs || undefined,
@@ -123,6 +143,8 @@ export default function AdminEventsPage() {
         capacity: formData.capacity,
         status: formData.status,
         bannerUrl: formData.bannerUrl || undefined,
+        externalBookingEnabled: formData.externalBookingEnabled,
+        externalBookingUrl: formData.externalBookingEnabled ? formData.externalBookingUrl : undefined,
       };
 
       if (editingEvent) {
@@ -340,6 +362,43 @@ export default function AdminEventsPage() {
                 </select>
               </div>
 
+              {/* External Booking Section */}
+              <div className="border border-secondary-light-gray rounded-lg p-4 space-y-4">
+                <div className="flex items-center justify-between">
+                  <div>
+                    <label className="block text-sm font-medium text-gray-700">External Booking</label>
+                    <p className="text-xs text-gray-500">Redirect users to an external booking platform</p>
+                  </div>
+                  <button
+                    type="button"
+                    onClick={() => setFormData({ ...formData, externalBookingEnabled: !formData.externalBookingEnabled })}
+                    className={`relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary-yellow focus:ring-offset-2 ${
+                      formData.externalBookingEnabled ? 'bg-primary-yellow' : 'bg-gray-200'
+                    }`}
+                  >
+                    <span
+                      className={`pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${
+                        formData.externalBookingEnabled ? 'translate-x-5' : 'translate-x-0'
+                      }`}
+                    />
+                  </button>
+                </div>
+                
+                {formData.externalBookingEnabled && (
+                  <div>
+                    <Input
+                      label="External Booking URL"
+                      type="url"
+                      value={formData.externalBookingUrl}
+                      onChange={(e) => setFormData({ ...formData, externalBookingUrl: e.target.value })}
+                      placeholder="https://example.com/book"
+                      required
+                    />
+                    <p className="text-xs text-gray-500 mt-1">Must be a valid HTTPS URL</p>
+                  </div>
+                )}
+              </div>
+
               {/* Image Upload / Media Picker */}
               <MediaPicker
                 value={formData.bannerUrl}