🔀 Merge branch 'dev' into feature/add-basic-authentication

src/widgets/calendar/CalendarTile.tsx

@@ -2,8 +2,9 @@ import { useMantineTheme } from '@mantine/core';
 import { Calendar } from '@mantine/dates';
 import { IconCalendarTime } from '@tabler/icons-react';
 import { useSession } from 'next-auth/react';
-import { i18n } from 'next-i18next';
 import { useState } from 'react';
+import { useRouter } from 'next/router';
+import { getLanguageByCode } from '~/tools/language';
 import { RouterOutputs, api } from '~/utils/api';
 
 import { useEditModeStore } from '../../components/Dashboard/Views/useEditModeStore';
@@ -30,20 +31,20 @@ const definition = defineWidget({
       type: 'select',
       defaultValue: 'inCinemas',
       data: [
-        { label: 'In Cinemas', value: 'inCinemas' },
-        { label: 'Physical', value: 'physicalRelease' },
-        { label: 'Digital', value: 'digitalRelease' },
+        { value: 'inCinemas' },
+        { value: 'physicalRelease' },
+        { value: 'digitalRelease' },
       ],
     },
     fontSize: {
       type: 'select',
       defaultValue: 'xs',
       data: [
-        { label: 'Extra Small', value: 'xs' },
-        { label: 'Small', value: 'sm' },
-        { label: 'Medium', value: 'md' },
-        { label: 'Large', value: 'lg' },
-        { label: 'Extra Large', value: 'xl' },
+        { value: 'xs' },
+        { value: 'sm' },
+        { value: 'md' },
+        { value: 'lg' },
+        { value: 'xl' },
       ],
     },
   },
@@ -63,6 +64,7 @@ interface CalendarTileProps {
 }
 
 function CalendarTile({ widget }: CalendarTileProps) {
+  const { locale } = useRouter();
   const { colorScheme, radius } = useMantineTheme();
   const { name: configName } = useConfigContext();
   const [month, setMonth] = useState(new Date());
@@ -72,6 +74,9 @@ function CalendarTile({ widget }: CalendarTileProps) {
     enabled: !!sessionData?.user,
   });
 
+  const language = getLanguageByCode(locale ?? 'en');
+  require(`dayjs/locale/${language.locale}.js`);
+
   const { data: medias } = api.calendar.medias.useQuery(
     {
       configName: configName!,
@@ -93,7 +98,7 @@ function CalendarTile({ widget }: CalendarTileProps) {
       onPreviousMonth={setMonth}
       onNextMonth={setMonth}
       size={widget.properties.fontSize}
-      locale={i18n?.resolvedLanguage ?? 'en'}
+      locale={language.locale}
       firstDayOfWeek={getFirstDayOfWeek(firstDayOfWeek)}
       hideWeekdays={widget.properties.hideWeekDays}
       style={{ position: 'relative' }}