feat: implement cover image upload with canvas compression and db storage in RIT-EMS-main

RIT-EVENT-MANAGEMENT--main/components/CreateEventForm.tsx

@@ -196,7 +196,30 @@ const CreateEventForm: React.FC<CreateEventFormProps> = ({ onCancel, onSuccess,
     if (file) {
       const reader = new FileReader();
       reader.onloadend = () => {
-        setFormData(prev => ({ ...prev, image: reader.result as string }));
+        const img = new Image();
+        img.onload = () => {
+          const canvas = document.createElement('canvas');
+          const max_width = 800;
+          let width = img.width;
+          let height = img.height;
+
+          if (width > max_width) {
+            height = Math.round((height * max_width) / width);
+            width = max_width;
+          }
+
+          canvas.width = width;
+          canvas.height = height;
+          const ctx = canvas.getContext('2d');
+          if (ctx) {
+            ctx.drawImage(img, 0, 0, width, height);
+            const compressedBase64 = canvas.toDataURL('image/jpeg', 0.7);
+            setFormData(prev => ({ ...prev, image: compressedBase64 }));
+          } else {
+            setFormData(prev => ({ ...prev, image: reader.result as string }));
+          }
+        };
+        img.src = reader.result as string;
       };
       reader.readAsDataURL(file);
     }
@@ -326,12 +349,8 @@ const CreateEventForm: React.FC<CreateEventFormProps> = ({ onCancel, onSuccess,
 
     setIsSubmitting(true);
     try {
-      let finalImageUrl = formData.image;
-
-      if (formData.image.startsWith('data:')) {
-        const fileName = `events/${Date.now()}_${formData.title.replace(/\s+/g, '_')}.jpg`;
-        finalImageUrl = await uploadToSupabase(formData.image, fileName);
-      }
+      // Keep Base64 string directly in the database, ignoring Firebase/Supabase storage
+      const finalImageUrl = formData.image;
 
       const totalLimit = parseInt(formData.maxParticipants);