feat: add new frontend components, MH batch worker, and gitignore rules

- Add all new Frontend source files (pages, components, hooks, utils)
- Add selenium_MHBatchPaymentCheckWorker.py and MHSinglePaymentCheckWorker.py
- Add install-steps-5-13.sh setup script
- Update .gitignore to exclude runtime/sensitive data (backups, uploads,
  chat-history, keys, downloads, generated .d.ts files) while keeping folders
- Add .gitkeep to preserve empty runtime folders in git

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/Frontend/src/components/payments/payments-of-patient-table.jsx

@@ -0,0 +1,90 @@
+import { forwardRef, useEffect, useState } from "react";
+import { PatientTable } from "../patients/patient-table";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle, } from "@/components/ui/card";
+import PaymentsRecentTable from "./payments-recent-table";
+const PaymentsOfPatientModal = forwardRef(({ initialPatient = null, openInitially = false, onClose }, ref) => {
+    const [selectedPatient, setSelectedPatient] = useState(null);
+    const [isModalOpen, setIsModalOpen] = useState(false);
+    const [paymentsPage, setPaymentsPage] = useState(1);
+    // minimal, local scroll + cleanup — put inside PaymentsOfPatientModal
+    useEffect(() => {
+        if (!selectedPatient)
+            return;
+        const raf = requestAnimationFrame(() => {
+            const card = document.getElementById("payments-for-patient-card");
+            const main = document.querySelector("main"); // your app's scroll container
+            if (card && main instanceof HTMLElement) {
+                const parentRect = main.getBoundingClientRect();
+                const cardRect = card.getBoundingClientRect();
+                const relativeTop = cardRect.top - parentRect.top + main.scrollTop;
+                const offset = 8;
+                main.scrollTo({
+                    top: Math.max(0, relativeTop - offset),
+                    behavior: "smooth",
+                });
+            }
+        });
+        // cleanup: when selectedPatient changes (ddmodal closes) or component unmounts,
+        // reset the main scroll to top so other pages are not left scrolled.
+        return () => {
+            cancelAnimationFrame(raf);
+            const main = document.querySelector("main");
+            if (main instanceof HTMLElement) {
+                // immediate reset (no animation) so navigation to other pages starts at top
+                main.scrollTo({ top: 0, behavior: "auto" });
+            }
+        };
+    }, [selectedPatient]);
+    // when parent provides an initialPatient and openInitially flag, apply it
+    useEffect(() => {
+        if (initialPatient) {
+            setSelectedPatient(initialPatient);
+            setPaymentsPage(1);
+        }
+        if (openInitially) {
+            setIsModalOpen(true);
+        }
+    }, [initialPatient, openInitially]);
+    const handleSelectPatient = (patient) => {
+        if (patient) {
+            setSelectedPatient(patient);
+            setPaymentsPage(1);
+            setIsModalOpen(true);
+        }
+        else {
+            setSelectedPatient(null);
+            setIsModalOpen(false);
+        }
+    };
+    return (<div className="space-y-8 py-8">
+        {/* Payments Section */}
+        {selectedPatient && (<Card id="payments-for-patient-card">
+            <CardHeader>
+              <CardTitle>
+                Payments for {selectedPatient.firstName}{" "}
+                {selectedPatient.lastName}
+              </CardTitle>
+              <CardDescription>
+                Displaying recent payments for the selected patient.
+              </CardDescription>
+            </CardHeader>
+            <CardContent>
+              <PaymentsRecentTable patientId={selectedPatient.id} allowEdit allowDelete onPageChange={setPaymentsPage}/>
+            </CardContent>
+          </Card>)}
+
+        {/* Patients Section */}
+        <Card>
+          <CardHeader>
+            <CardTitle>Patient Records</CardTitle>
+            <CardDescription>
+              Select any patient and View all their recent payments.
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <PatientTable allowView allowCheckbox onSelectPatient={handleSelectPatient}/>
+          </CardContent>
+        </Card>
+      </div>);
+});
+export default PaymentsOfPatientModal;