feat: allow users to start the calendar week on Monday (#13295)

resolve twentyhq/core-team-issues#1255 - Introduced a new field isWeekStartMonday in the workspaceMember table. - Added a function updateCalendarStartDay to update the isWeekStartMonday value when the user toggles the corresponding field in the settings. The logic works for me, but I couldn’t find a way to create the column locally in the database for the workspaceMember tables. Please let me know if this approach looks good and how to properly create dynamic columns that are not directly handled via migration. https://github.com/user-attachments/assets/4eebada5-6a96-4a88-8e96-98f1501859e3 --------- Co-authored-by: Félix Malfait <felix.malfait@gmail.com> Co-authored-by: Félix Malfait <felix@twenty.com>
2025-07-30 11:46:05 +01:00
parent 1972e2fbf7
commit ad69ed9aba
31 changed files with 507 additions and 136 deletions
@@ -0,0 +1,74 @@
+import { CalendarStartDay } from '@/localization/constants/CalendarStartDay';
+
+const MONDAY_KEY: keyof typeof CalendarStartDay = 'MONDAY';
+const SATURDAY_KEY: keyof typeof CalendarStartDay = 'SATURDAY';
+const SUNDAY_KEY: keyof typeof CalendarStartDay = 'SUNDAY';
+
+export const detectCalendarStartDay = (): keyof typeof CalendarStartDay => {
+  // Use Intl.Locale to get the first day of the week from the user's locale
+  // This requires a modern browser that supports Intl.Locale
+  try {
+    const locale = new Intl.Locale(navigator.language);
+
+    // Check if the weekInfo property is available (newer browsers)
+    if (
+      'weekInfo' in locale &&
+      locale.weekInfo !== null &&
+      locale.weekInfo !== undefined &&
+      typeof locale.weekInfo === 'object' &&
+      'firstDay' in locale.weekInfo
+    ) {
+      const firstDay = locale.weekInfo.firstDay;
+
+      // Map Intl.Locale firstDay values to our enum keys
+      // Intl.Locale uses 1=Monday, 7=Sunday, 6=Saturday
+      switch (firstDay) {
+        case 1:
+          return MONDAY_KEY;
+        case 6:
+          return SATURDAY_KEY;
+        case 7:
+        default:
+          return SUNDAY_KEY;
+      }
+    }
+  } catch (error) {
+    // Fallback if Intl.Locale is not supported or fails
+  }
+
+  // Fallback: Use a heuristic based on common locale patterns
+  const language = navigator.language.toLowerCase();
+
+  // Most European countries, Australia, New Zealand start with Monday
+  if (
+    language.startsWith('de') || // German
+    language.startsWith('fr') || // French
+    language.startsWith('es') || // Spanish
+    language.startsWith('it') || // Italian
+    language.startsWith('pt') || // Portuguese
+    language.startsWith('nl') || // Dutch
+    language.startsWith('sv') || // Swedish
+    language.startsWith('no') || // Norwegian
+    language.startsWith('da') || // Danish
+    language.startsWith('fi') || // Finnish
+    language.startsWith('pl') || // Polish
+    language.startsWith('ru') || // Russian
+    language.startsWith('en-gb') || // British English
+    language.startsWith('en-au') || // Australian English
+    language.startsWith('en-nz') // New Zealand English
+  ) {
+    return MONDAY_KEY;
+  }
+
+  // Middle Eastern countries often start with Saturday
+  if (
+    language.startsWith('ar') || // Arabic
+    language.startsWith('he') || // Hebrew
+    language.startsWith('fa') // Persian
+  ) {
+    return SATURDAY_KEY;
+  }
+
+  // Default to Sunday (US, Canada, Japan, etc.)
+  return SUNDAY_KEY;
+};
@@ -1,5 +1,5 @@
 import { formatTimeZoneLabel } from '@/localization/utils/formatTimeZoneLabel';
-import { AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL } from '@/settings/accounts/constants/AvailableTimezoneOptionsByLabel';
+import { AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL } from '@/settings/experience/constants/AvailableTimezoneOptionsByLabel';

 /**
 * Finds the matching available IANA time zone select option from a given IANA time zone.