fix: update date formatting and locale handling in DatePicker and Calendar components

resources/js/components/inputs/date-picker.tsx

@@ -1,5 +1,5 @@
 import { format } from 'date-fns';
-import { id } from 'date-fns/locale';
+import { id as idLocale } from 'react-day-picker/locale';
 import { CalendarIcon } from 'lucide-react';
 import * as React from 'react';
 
@@ -59,7 +59,7 @@ function DatePicker({
 return '';
 }
 
-        return format(date, 'dd MMM yyyy', { locale: id });
+        return format(date, 'dd MMM yyyy', { locale: idLocale });
     }, [date]);
 
     return (
@@ -82,6 +82,7 @@ return '';
             <PopoverContent className="w-auto p-0" align="start">
                 <Calendar
                     mode="single"
+                    locale={idLocale}
                     selected={date}
                     onSelect={(selectedDate) => {
                         onChange?.(selectedDate);

resources/js/components/ui/calendar.tsx

@@ -38,8 +38,8 @@ function Calendar({
       )}
       captionLayout={captionLayout}
       formatters={{
-        formatMonthDropdown: (date) =>
-          date.toLocaleString("default", { month: "short" }),
+        formatMonthDropdown: (date, options) =>
+          date.toLocaleString(options?.locale?.code ?? "id", { month: "short" }),
         ...formatters,
       }}
       classNames={{