mikicvi
109 lines
4.6 KiB
Markdown
109 lines
4.6 KiB
Markdown
# 🇮🇪 Irish Localization Implementation Complete
|
|
|
|
## Overview
|
|
|
|
Successfully implemented Irish localization for the table tennis booking app, with Monday as the first day of the week and Irish (en-IE) date formatting throughout.
|
|
|
|
## Key Changes Made
|
|
|
|
### 1. Utility Functions (`lib/utils.ts`)
|
|
|
|
- **Updated `getWeekDays()`**: Now returns Monday-Sunday order with proper JS day values
|
|
- **Added Irish conversion functions**:
|
|
- `getIrishDayOfWeek()`: Converts JS getDay() (0=Sunday) to Irish standard (0=Monday)
|
|
- `getJavaScriptDayOfWeek()`: Converts Irish day index back to JS getDay() format
|
|
- `getIrishDayName()`: Gets day name using Irish week start
|
|
- **Updated `formatDate()`**: Changed from 'en-US' to 'en-IE' locale
|
|
|
|
### 2. Admin Time Slot Management (`components/admin/AdminTimeSlotManagement.tsx`)
|
|
|
|
- **Irish week order**: Days now display Monday through Sunday
|
|
- **Updated constants**: `IRISH_DAY_ORDER = [1, 2, 3, 4, 5, 6, 0]` for correct mapping
|
|
- **Form defaults**: New time slots default to Monday (dayOfWeek: 1)
|
|
- **Display logic**: Correctly maps JS day values to Irish display order
|
|
- **Dropdown options**: Time slot creation shows days in Irish order
|
|
|
|
### 3. Calendar UI Component (`components/ui/calendar.tsx`)
|
|
|
|
- **Added `weekStartsOn={1}`**: Calendar widget now starts with Monday
|
|
- **Updated locale**: Changed month formatting to 'en-IE'
|
|
- **Data attributes**: Updated to use Irish locale for consistency
|
|
|
|
### 4. Enhanced Booking Calendar (`components/booking/enhanced-booking-calendar.tsx`)
|
|
|
|
- **Date formatting**: All `toLocaleDateString()` calls updated to 'en-IE'
|
|
- **Consistent display**: Weekday abbreviations and full date formats use Irish locale
|
|
- **Time slot logic**: Maintains compatibility with JS day values in database
|
|
|
|
### 5. All Other Components
|
|
|
|
Updated locale formatting in:
|
|
|
|
- `components/dashboard/BookingCalendar.tsx`
|
|
- `components/user/user-profile.tsx`
|
|
- `components/notifications/announcements.tsx`
|
|
- `components/admin/AdminUserManagement.tsx`
|
|
- `components/admin/AdminAnnouncementManagement.tsx`
|
|
- `components/admin/AdminCourtManagement.tsx`
|
|
|
|
### 6. API Compatibility Fix
|
|
|
|
- **Fixed Next.js 15 async params**: Updated time-slots/[id]/route.ts to properly handle async params
|
|
|
|
## Database Compatibility
|
|
|
|
- **No database changes needed**: Database still stores JavaScript's getDay() values (0=Sunday, 6=Saturday)
|
|
- **Mapping handled in UI**: All conversion between JS day values and Irish display order handled in frontend
|
|
- **Backward compatibility**: Existing time slots and bookings work seamlessly
|
|
|
|
## Technical Implementation
|
|
|
|
### Day Mapping Logic
|
|
|
|
```javascript
|
|
// JavaScript getDay() values remain in database:
|
|
// 0=Sunday, 1=Monday, 2=Tuesday, 3=Wednesday, 4=Thursday, 5=Friday, 6=Saturday
|
|
|
|
// Irish display order (Monday first):
|
|
const IRISH_DAY_ORDER = [1, 2, 3, 4, 5, 6, 0]; // Maps to Monday-Sunday
|
|
|
|
// Admin panel shows: Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday
|
|
// But stores as: 1, 2, 3, 4, 5, 6, 0
|
|
```
|
|
|
|
### Locale Settings
|
|
|
|
- **Calendar**: Starts with Monday (`weekStartsOn={1}`)
|
|
- **Date Format**: Irish format (DD/MM/YYYY pattern via en-IE)
|
|
- **Time Format**: Maintained 24-hour format as requested
|
|
- **Day Names**: All components use Irish week order for display
|
|
|
|
## User Impact
|
|
|
|
1. **Admin Interface**: Time slot management shows Monday first, making it intuitive for Irish users
|
|
2. **Booking Calendar**: Date selection and display follow Irish conventions
|
|
3. **Date Display**: All dates throughout the app use Irish formatting (en-IE)
|
|
4. **Week View**: Calendar widgets start with Monday as expected in Ireland
|
|
|
|
## Testing Verification
|
|
|
|
- ✅ Created test script (`scripts/test-irish-localization.js`) to verify settings
|
|
- ✅ Confirmed day mapping logic works correctly
|
|
- ✅ Verified Irish date formatting across all components
|
|
- ✅ Time slot management displays in correct order
|
|
- ✅ Calendar widgets start with Monday
|
|
|
|
## Benefits
|
|
|
|
- **Cultural Alignment**: Follows Irish/European convention of Monday as week start
|
|
- **User Experience**: More intuitive for Irish users
|
|
- **Consistency**: All date formatting uses Irish locale
|
|
- **Maintainable**: Clean separation between database storage and display logic
|
|
- **No Breaking Changes**: Existing bookings and time slots continue to work
|
|
|
|
## Future Considerations
|
|
|
|
- Could extend to full internationalization (i18n) if needed for other locales
|
|
- Day conversion utilities are ready for reuse across the application
|
|
- Database schema remains flexible for any future locale changes
|