fix: date localizations for chart

frontend/src/component/insights/componentsChart/CreationArchiveChart/CreationArchiveChart.tsx

@@ -23,6 +23,7 @@ import type { WeekData, RawWeekData } from './types.ts';
 import { createTooltip } from 'component/insights/components/LineChart/createTooltip.ts';
 import { CreationArchiveRatioTooltip } from './CreationArchiveRatioTooltip.tsx';
 import { Chart } from 'react-chartjs-2';
+import { getDateFnsLocale } from './getDateFnsLocale.ts';
 
 ChartJS.register(
     CategoryScale,
@@ -161,6 +162,11 @@ export const CreationArchiveChart: FC<ICreationArchiveChartProps> = ({
             locale: locationSettings.locale,
             scales: {
                 x: {
+                    adapters: {
+                        date: {
+                            locale: getDateFnsLocale(locationSettings.locale),
+                        },
+                    },
                     type: 'time' as const,
                     display: true,
                     time: {

frontend/src/component/insights/componentsChart/CreationArchiveChart/getDateFnsLocale.ts

@@ -0,0 +1,33 @@
+import 'chartjs-adapter-date-fns';
+import {
+    cs,
+    de,
+    da,
+    enGB,
+    enIN,
+    enUS,
+    fr,
+    nb,
+    ptBR,
+    sv,
+    ja,
+} from 'date-fns/locale';
+import type { defaultLocales } from 'constants/defaultLocales';
+
+const dateFnsLocales: { [key in (typeof defaultLocales)[number]]: Locale } = {
+    cs: cs,
+    'da-DK': da,
+    de: de,
+    'en-GB': enGB,
+    'en-IN': enIN,
+    'en-US': enUS,
+    'fr-FR': fr,
+    ja: ja,
+    'nb-NO': nb,
+    'pt-BR': ptBR,
+    'sv-SE': sv,
+};
+
+export const getDateFnsLocale = (locale: string): Locale => {
+    return dateFnsLocales[locale] ?? enUS;
+};

frontend/src/component/user/Profile/ProfileTab/ProfileTab.tsx

@@ -22,6 +22,7 @@ import { RoleBadge } from 'component/common/RoleBadge/RoleBadge';
 import { useUiFlag } from 'hooks/useUiFlag';
 import { ProductivityEmailSubscription } from './ProductivityEmailSubscription.tsx';
 import { formatDateYMDHM } from 'utils/formatDate.ts';
+import { defaultLocales } from '../../../../constants/defaultLocales.ts';
 
 const StyledHeader = styled('div')(({ theme }) => ({
     display: 'flex',
@@ -116,17 +117,8 @@ export const ProfileTab = ({ user }: IProfileTabProps) => {
     const [currentLocale, setCurrentLocale] = useState<string>();
     const exampleDateId = useId();
 
-    const [possibleLocales, setPossibleLocales] = useState([
-        'en-US',
-        'en-GB',
-        'nb-NO',
-        'sv-SE',
-        'da-DK',
-        'en-IN',
-        'de',
-        'cs',
-        'pt-BR',
-        'fr-FR',
+    const [possibleLocales, setPossibleLocales] = useState<string[]>([
+        ...defaultLocales,
     ]);
 
     useEffect(() => {

frontend/src/constants/defaultLocales.ts

@@ -0,0 +1,13 @@
+export const defaultLocales = [
+    'cs',
+    'da-DK',
+    'de',
+    'en-GB',
+    'en-IN',
+    'en-US',
+    'fr-FR',
+    'ja',
+    'nb-NO',
+    'pt-BR',
+    'sv-SE',
+] as const;