fix(banking): miscellaneous bug fixes (backport #55492) (#55979)

banking/src/components/features/ActionLog/ActionLogDialog.tsx

@@ -0,0 +1,34 @@
+import { Button } from '@/components/ui/button'
+import { DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'
+import _ from '@/lib/translate'
+import { Loader2Icon } from 'lucide-react'
+import { lazy, Suspense } from 'react'
+
+const ActionLogDialogBody = lazy(() => import('./ActionLogDialogBody'))
+
+const ActionLogDialogFallback = () => (
+	<div className="flex flex-1 items-center justify-center min-h-[40vh]">
+		<Loader2Icon className="size-6 animate-spin text-muted-foreground" />
+	</div>
+)
+
+const ActionLogDialog = ({ onClose }: { onClose: () => void }) => {
+	return (
+		<DialogContent className='min-w-[90vw]'>
+			<DialogHeader>
+				<DialogTitle>{_("Reconciliation History")}</DialogTitle>
+				<DialogDescription>{_("View all reconciliation actions taken in this session.")}</DialogDescription>
+			</DialogHeader>
+			<Suspense fallback={<ActionLogDialogFallback />}>
+				<ActionLogDialogBody />
+			</Suspense>
+			<DialogFooter>
+				<DialogClose asChild>
+					<Button variant={'outline'} size='md' onClick={onClose}>{_("Close")}</Button>
+				</DialogClose>
+			</DialogFooter>
+		</DialogContent>
+	)
+}
+
+export default ActionLogDialog