Added ability to change FullCalendar locale

package.json

@@ -60,6 +60,7 @@
         "color": "^4.2.1",
         "dav": "^1.8.0",
         "deep-equal": "^2.1.0",
+        "get-user-locale": "^2.3.0",
         "ical": "^0.8.0",
         "ical.js": "^1.5.0",
         "luxon": "^2.3.0",

src/ui/calendar.ts

@@ -48,6 +48,7 @@ interface ExtraRenderProps {
     firstDay?: number;
     initialView?: { desktop: string; mobile: string };
     timeFormat24h?: boolean;
+    locale?: string;
     openContextMenuForEvent?: (
         event: EventApi,
         mouseEvent: MouseEvent
@@ -220,6 +221,8 @@ export function renderCalendar(
         },
 
         longPressDelay: 250,
+
+        locale: settings?.locale,
     });
     cal.render();
     return cal;

src/ui/settings.ts

@@ -16,6 +16,8 @@ import { createElement } from "react";
 import { getDailyNoteSettings } from "obsidian-daily-notes-interface";
 import ReactModal from "./ReactModal";
 import { importCalendars } from "src/calendars/parsing/caldav/import";
+import allLocales from "@fullcalendar/core/locales-all";
+import { getUserLocales } from "get-user-locale";
 
 export interface FullCalendarSettings {
     calendarSources: CalendarInfo[];
@@ -26,6 +28,7 @@ export interface FullCalendarSettings {
         mobile: string;
     };
     timeFormat24h: boolean;
+    locale?: string;
 }
 
 export const DEFAULT_SETTINGS: FullCalendarSettings = {
@@ -37,8 +40,14 @@ export const DEFAULT_SETTINGS: FullCalendarSettings = {
         mobile: "timeGrid3Days",
     },
     timeFormat24h: false,
+    locale: defaultLocale(),
 };
 
+function defaultLocale(): string {
+    const userLocale = getUserLocales()[0].toLowerCase();
+    return allLocales.find((l) => l.code === userLocale)?.code || "en";
+}
+
 const WEEKDAYS = [
     "Sunday",
     "Monday",
@@ -231,6 +240,23 @@ export class FullCalendarSettingTab extends PluginSettingTab {
                 });
             });
 
+        new Setting(containerEl)
+            .setName("Locale")
+            .setDesc("Choose locale for date formats and language.")
+            .addDropdown((dropdown) => {
+                dropdown.addOption("en", "en-us");
+                allLocales.forEach((locale) => {
+                    dropdown.addOption(locale.code, locale.code);
+                });
+                dropdown.setValue(
+                    this.plugin.settings.locale || defaultLocale()
+                );
+                dropdown.onChange(async (locale) => {
+                    this.plugin.settings.locale = locale;
+                    await this.plugin.saveSettings();
+                });
+            });
+
         containerEl.createEl("h2", { text: "Manage Calendars" });
         addCalendarButton(
             this.app,

src/ui/view.ts

@@ -202,6 +202,7 @@ export class CalendarView extends ItemView {
             firstDay: this.plugin.settings.firstDay,
             initialView: this.plugin.settings.initialView,
             timeFormat24h: this.plugin.settings.timeFormat24h,
+            locale: this.plugin.settings.locale,
             openContextMenuForEvent: async (e, mouseEvent) => {
                 const menu = new Menu();
                 if (!this.plugin.cache) {