Display absolute date of reconciliation (#5521)

packages/desktop-client/src/components/accounts/Header.tsx

@@ -30,6 +30,7 @@ import { styles } from '@actual-app/components/styles';
 import { theme } from '@actual-app/components/theme';
 import { Tooltip } from '@actual-app/components/tooltip';
 import { View } from '@actual-app/components/view';
+import { format as formatDate } from 'date-fns';
 
 import { tsToRelativeTime } from 'loot-core/shared/util';
 import {
@@ -50,6 +51,7 @@ import { FiltersStack } from '@desktop-client/components/filters/FiltersStack';
 import { type SavedFilter } from '@desktop-client/components/filters/SavedFilterMenuButton';
 import { NotesButton } from '@desktop-client/components/NotesButton';
 import { SelectedTransactionsButton } from '@desktop-client/components/transactions/SelectedTransactionsButton';
+import { useDateFormat } from '@desktop-client/hooks/useDateFormat';
 import { useLocale } from '@desktop-client/hooks/useLocale';
 import { useLocalPref } from '@desktop-client/hooks/useLocalPref';
 import { useSplitsExpanded } from '@desktop-client/hooks/useSplitsExpanded';
@@ -198,6 +200,7 @@ export function AccountHeader({
   const isServerOffline = syncServerStatus === 'offline';
   const [_, setExpandSplitsPref] = useLocalPref('expand-splits');
 
+  const dateFormat = useDateFormat() || 'MM/dd/yyyy';
   const locale = useLocale();
 
   let canSync = !!(account?.account_id && isUsingServer);
@@ -389,7 +392,19 @@ export function AccountHeader({
                 }}
                 content={
                   account?.last_reconciled
-                    ? `${t('Reconciled')} ${tsToRelativeTime(account.last_reconciled, locale)}`
+                    ? t('Reconciled {{relativeTimeAgo}} ({{absoluteDate}})', {
+                        relativeTimeAgo: tsToRelativeTime(
+                          account.last_reconciled,
+                          locale,
+                        ),
+                        absoluteDate: formatDate(
+                          new Date(
+                            parseInt(account.last_reconciled ?? '0', 10),
+                          ),
+                          dateFormat,
+                          { locale },
+                        ),
+                      })
                     : t('Not yet reconciled')
                 }
                 placement="top"

packages/desktop-client/src/components/accounts/Reconcile.tsx

@@ -10,6 +10,7 @@ import { styles } from '@actual-app/components/styles';
 import { Text } from '@actual-app/components/text';
 import { theme } from '@actual-app/components/theme';
 import { View } from '@actual-app/components/view';
+import { format as formatDate } from 'date-fns';
 import { t } from 'i18next';
 
 import { evalArithmetic } from 'loot-core/shared/arithmetic';
@@ -18,6 +19,7 @@ import { tsToRelativeTime, amountToInteger } from 'loot-core/shared/util';
 import { type AccountEntity } from 'loot-core/types/models';
 import { type TransObjectLiteral } from 'loot-core/types/util';
 
+import { useDateFormat } from '@desktop-client/hooks/useDateFormat';
 import { useFormat } from '@desktop-client/hooks/useFormat';
 import { useLocale } from '@desktop-client/hooks/useLocale';
 import { useSheetValue } from '@desktop-client/hooks/useSheetValue';
@@ -137,6 +139,7 @@ export function ReconcileMenu({
   });
   const lastSyncedBalance = account.balance_current;
   const format = useFormat();
+  const dateFormat = useDateFormat() || 'MM/dd/yyyy';
   const locale = useLocale();
 
   const [inputValue, setInputValue] = useState<string | null>();
@@ -202,11 +205,16 @@ export function ReconcileMenu({
         )}
         <Text style={{ color: theme.pageTextSubdued, paddingBottom: 6 }}>
           {account?.last_reconciled
-            ? t('Reconciled {{ relativeTimeAgo }}', {
+            ? t('Reconciled {{ relativeTimeAgo }} ({{ absoluteDate }})', {
                 relativeTimeAgo: tsToRelativeTime(
                   account.last_reconciled,
                   locale,
                 ),
+                absoluteDate: formatDate(
+                  new Date(parseInt(account.last_reconciled ?? '0', 10)),
+                  dateFormat,
+                  { locale },
+                ),
               })
             : t('Not yet reconciled')}
         </Text>

upcoming-release-notes/5521.md

@@ -0,0 +1,6 @@
+---
+category: Enhancements
+authors: [j-maas]
+---
+
+Show the absolute date of reconciliation (e.g. "08/08/2025") in addition to the relative date (e.g. "3 days ago")