my-app/src/components/ui/TimeCardContainer.module.css

@@ -88,7 +88,6 @@
 		display: flex;
 		flex-direction: column;
 		gap: 0.5rem;
-		width: 100%;
 		align-items: center;
 	}
 	

my-app/src/context/SettingsContext.jsx

@@ -4,6 +4,24 @@ import { USER } from '../constants/bookingConstants';
 
 const SettingsContext = createContext();
 
+// Single source of truth for default settings
+const DEFAULT_SETTINGS = {
+	mockToday: null,
+	bookingRangeDays: 14,
+	roomAvailabilityChance: 0.7,
+	numberOfRooms: 5,
+	earliestTimeSlot: 0,
+	latestTimeSlot: 23,
+	currentUserName: USER.name,
+	showDevelopmentBanner: false,
+	showBookingConfirmationBanner: false,
+	showBookingDeleteBanner: false,
+	bookingFormType: 'inline-modal-extended',
+	showFiltersAlways: true,
+	newBookingLayoutVariant: false,
+	bookingCardEditMode: 'inline',
+};
+
 export const useSettingsContext = () => {
 	const context = useContext(SettingsContext);
 	if (!context) {
@@ -20,22 +38,9 @@ export const SettingsProvider = ({ children }) => {
 			try {
 				const parsed = JSON.parse(saved);
 				return {
-					// Set defaults first
-					mockToday: null,
-					bookingRangeDays: 14,
-					roomAvailabilityChance: 0.7,
-					numberOfRooms: 5,
-					earliestTimeSlot: 0,
-					latestTimeSlot: 23,
-					currentUserName: USER.name,
-					showDevelopmentBanner: false,
-					showBookingConfirmationBanner: false,
-					showBookingDeleteBanner: false,
-					bookingFormType: 'inline', // 'modal' or 'inline'
-					showFiltersAlways: false, // Show filter dropdowns always or behind toggle button
-					newBookingLayoutVariant: false, // false = stacked, true = side-by-side
-					bookingCardEditMode: 'inline', // 'inline', 'modal', or 'responsive'
-					// Then override with saved values
+					// Start with defaults
+					...DEFAULT_SETTINGS,
+					// Override with saved values
 					...parsed,
 					// Convert date strings back to DateValue objects
 					mockToday: parsed.mockToday ? new Date(parsed.mockToday) : null,
@@ -47,34 +52,7 @@ export const SettingsProvider = ({ children }) => {
 			}
 		}
 		
-		return {
-			// Use mock date if set, otherwise real today
-			mockToday: null,
-			// Days in the future users can book
-			bookingRangeDays: 14,
-			// Room availability percentage
-			roomAvailabilityChance: 0.7,
-			// Number of rooms
-			numberOfRooms: 5,
-			// Earliest booking time (in half-hour slots from 8:00)
-			earliestTimeSlot: 0, // 8:00
-			// Latest booking time
-			latestTimeSlot: 23, // 19:30 (last slot ending at 20:00)
-			// Current user settings
-			currentUserName: USER.name,
-			// Development banner toggle
-			showDevelopmentBanner: false,
-			// Booking confirmation banner toggle
-			showBookingConfirmationBanner: false,
-			// Booking delete banner toggle
-			showBookingDeleteBanner: false,
-			// Booking form type
-			bookingFormType: 'inline', // 'modal' or 'inline'
-			// Filter display mode
-			showFiltersAlways: false, // Show filter dropdowns always or behind toggle button
-			// New booking page layout variant
-			newBookingLayoutVariant: false, // false = stacked, true = side-by-side
-		};
+		return DEFAULT_SETTINGS;
 	});
 
 	// Save settings to localStorage whenever they change
@@ -106,22 +84,7 @@ export const SettingsProvider = ({ children }) => {
 	};
 
 	const resetSettings = () => {
-		setSettings({
-			mockToday: null,
-			bookingRangeDays: 14,
-			roomAvailabilityChance: 0.7,
-			numberOfRooms: 5,
-			earliestTimeSlot: 0,
-			latestTimeSlot: 23,
-			currentUserName: USER.name, // This will reset to "Jacob Reinikainen"
-			showDevelopmentBanner: false,
-			showBookingConfirmationBanner: false,
-			showBookingDeleteBanner: false,
-			bookingFormType: 'inline',
-			showFiltersAlways: false,
-			newBookingLayoutVariant: false,
-			bookingCardEditMode: 'inline',
-		});
+		setSettings(DEFAULT_SETTINGS);
 		localStorage.removeItem('calendarSettings');
 	};