improvement: rtl direction, solar calendar and persian formatting added for persian users.

frontend/src/components/ui/treatment/PastTreatmentsPanel.tsx

@@ -1,13 +1,15 @@
 'use client';
 
 import { useMemo, useState } from 'react';
-import { useTranslations } from 'next-intl';
+import { useLocale, useTranslations } from 'next-intl';
 import { Button } from '@/components/ui/shared/Button';
 import { Checkbox } from '@/components/ui/shared/Checkbox';
 import { FORM_SELECT_CLASS } from '@/components/shared/formSelectStyles';
 import { TreatmentHistoryDetailLine } from '@/components/ui/treatment/TreatmentHistoryDetailLine';
 import { DetailLabSendBadge } from '@/components/ui/treatment/DetailLabSendBadge';
 import { filterTreatmentHistoryItems } from '@/components/treatment/treatmentHistoryFilters';
+import { AppDateInput } from '@/components/ui/shared/AppDateInput';
+import { APP_DATE, formatAppDateTime } from '@/lib/i18n/format';
 import type { LinkedOrganizationOption, PastTreatment } from '@/types/treatment';
 import type { TreatmentCatalogEntry } from '@/types/treatment-catalog';
 
@@ -25,16 +27,8 @@ interface PastTreatmentsPanelProps {
   compact?: boolean;
 }
 
-function formatHistoryTimestamp(iso: string): string {
-  const date = new Date(iso);
-  return date.toLocaleString(undefined, {
-    weekday: 'short',
-    month: 'short',
-    day: 'numeric',
-    year: 'numeric',
-    hour: 'numeric',
-    minute: '2-digit',
-  });
+function formatHistoryTimestamp(iso: string, locale: string): string {
+  return formatAppDateTime(iso, locale, APP_DATE.history);
 }
 
 export function PastTreatmentsPanel({
@@ -50,6 +44,7 @@ export function PastTreatmentsPanel({
   onSelectTreatment,
   compact = false,
 }: PastTreatmentsPanelProps) {
+  const locale = useLocale();
   const t = useTranslations('treatment');
   const [notShippedOnly, setNotShippedOnly] = useState(false);
   const [filterDate, setFilterDate] = useState('');
@@ -71,7 +66,7 @@ export function PastTreatmentsPanel({
     setFilterDate('');
   }
 
-  const filterInputClass = `${FORM_SELECT_CLASS} rounded-md px-2 py-1.5 text-xs min-w-[9.5rem]`;
+  const filterInputClass = `${FORM_SELECT_CLASS} rounded-md py-1.5 text-xs min-w-[9.5rem]`;
 
   const filtersBlock = (
     <div
@@ -89,10 +84,9 @@ export function PastTreatmentsPanel({
         <span className="text-xs font-medium text-text-muted whitespace-nowrap">
           {t('historyFilterDate')}
         </span>
-        <input
-          type="date"
+        <AppDateInput
           value={filterDate}
-          onChange={(e) => setFilterDate(e.target.value)}
+          onChange={setFilterDate}
           className={filterInputClass}
         />
       </label>
@@ -156,7 +150,7 @@ export function PastTreatmentsPanel({
                   className="text-xs font-medium text-text-primary tabular-nums"
                   dateTime={treatment.treatmentAt}
                 >
-                  {formatHistoryTimestamp(treatment.treatmentAt)}
+                  {formatHistoryTimestamp(treatment.treatmentAt, locale)}
                 </time>
                 {isLiveDraft ? (
                   <span className="text-[10px] font-medium uppercase tracking-wide text-primary">