Image error resolve

src/components/education/EducationTraining.tsx

@@ -398,7 +398,7 @@ const EducationTraining: React.FC = () => {
                             Contact Admissions
                         </Link>
                         <Link
-                            href="/brochure"
+                            href="/#"
                             className="inline-block px-6 py-3 text-sm font-medium rounded border-2 hover:opacity-70 transition-opacity duration-300"
                             style={{
                                 borderColor: '#012068',

src/lib/api.ts

@@ -14,7 +14,7 @@ export interface Event {
   venue?: Venue[];
   highlights?: string[];
   organisers?: string[];
-  fee?: Fee[];  // Updated to match backend structure
+  fee?: Fee[];
   phone: string;
   email: string;
   isActive: boolean;
@@ -29,7 +29,7 @@ interface Venue {
 }
 
 interface Fee {
-  description: string;  // Updated from 'desc' to 'description'
+  description: string;
   cost: number;
 }
 
@@ -46,6 +46,29 @@ class EventAPI {
     this.baseUrl = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:8080';
   }
 
+  // Helper method to convert relative URLs to absolute URLs
+  private getFullImageUrl(imageUrl: string | undefined): string {
+    if (!imageUrl || imageUrl.trim() === '') return '';
+    
+    // If it's already a full URL, return as-is
+    if (imageUrl.startsWith('http://') || imageUrl.startsWith('https://')) {
+      return imageUrl;
+    }
+    
+    // If it's a relative URL, prepend the backend API URL
+    const cleanUrl = imageUrl.startsWith('/') ? imageUrl.substring(1) : imageUrl;
+    return `${this.baseUrl}/${cleanUrl}`;
+  }
+
+  // Process event to fix image URLs
+  private processEvent(event: Event): Event {
+    return {
+      ...event,
+      mainImage: this.getFullImageUrl(event.mainImage),
+      galleryImages: event.galleryImages?.map(img => this.getFullImageUrl(img)).filter(img => img !== '') || []
+    };
+  }
+
   // File upload method
   async uploadImage(file: File): Promise<{url: string, filename: string}> {
     try {
@@ -54,14 +77,21 @@ class EventAPI {
 
       const response = await fetch(`${this.baseUrl}/api/files/upload`, {
         method: 'POST',
-        body: formData, // Don't set Content-Type header for FormData
+        body: formData,
       });
 
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
 
-      return await response.json();
+      const result = await response.json();
+      
+      // Ensure the URL is absolute
+      if (result.url) {
+        result.url = this.getFullImageUrl(result.url);
+      }
+      
+      return result;
     } catch (error) {
       console.error('Error uploading image:', error);
       throw error;
@@ -86,13 +116,16 @@ class EventAPI {
         headers: {
           'Content-Type': 'application/json',
         },
+        cache: 'no-store', // Ensure fresh data
       });
 
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
 
-      return await response.json();
+      const events = await response.json();
+      // Process all events to fix image URLs
+      return events.map((event: Event) => this.processEvent(event));
     } catch (error) {
       console.error('Error fetching events:', error);
       throw error;
@@ -106,13 +139,16 @@ class EventAPI {
         headers: {
           'Content-Type': 'application/json',
         },
+        cache: 'no-store',
       });
 
       if (!response.ok) {
         throw new Error(`HTTP error! status: ${response.status}`);
       }
 
-      return await response.json();
+      const event = await response.json();
+      // Process event to fix image URLs
+      return this.processEvent(event);
     } catch (error) {
       console.error('Error fetching event:', error);
       throw error;