12 Added notes and colours to customers

app/javascript/controllers/customer_search_controller.js

@@ -66,7 +66,8 @@ export default class extends Controller {
           return '<div class="no-results">No customers found. Fill in the details below.</div>';
         },
         option: function(item) {
-          return `<div>${item.label}</div>`;
+          const colorStyle = item.color_hex ? `background-color: ${item.color_hex}20; border-left: 4px solid ${item.color_hex};` : '';
+          return `<div style="${colorStyle} padding: 8px;">${item.label}</div>`;
         }
       },
 
@@ -98,6 +99,9 @@ export default class extends Controller {
     if (initialValue) {
        this.newCustomerFieldsTarget.classList.add('hidden');
        this.customerSelected(initialValue); 
+    } else {
+       // Show new customer fields if no existing customer
+       this.showNewCustomerFields();
     }
   }
 
@@ -148,4 +152,4 @@ export default class extends Controller {
       this.selectInstance.destroy();
     }
   }
-} 
+} 

app/javascript/controllers/main_calendar_controller.js

@@ -89,7 +89,8 @@ export default class extends Controller {
           return ''; // Empty location as requested
         },
         popupDetailAttendees(eventObj) {
-          return eventObj.attendees[0]; // Show team name
+          const teamName = eventObj.attendees[0]; // Show team name
+          return teamName;
         },
         popupDetailState(eventObj) {
           return '';
@@ -148,11 +149,13 @@ export default class extends Controller {
       const startTime = new Date(reservation.start_time);
       const endTime = new Date(reservation.end_time);
       
-      // Create the event
+      // Create the event with customer name only
+      const customerName = reservation.customer ? `${reservation.customer.first_name} ${reservation.customer.surname}` : '';
+      
       const event = {
         id: `reservation-${reservation.id}`,
         calendarId: calendarId,
-        title: reservation.customer ? `${reservation.customer.first_name} ${reservation.customer.surname}` : '',
+        title: customerName,
         start: startTime,
         end: endTime,
         category: 'time',
@@ -276,4 +279,4 @@ export default class extends Controller {
     // Update calendar display
     window.calendar.render();
   }
-}
+}