feat: add debug logging and improve proof-of-payment icon styling

Changes:
- Add console.log statements for shareId validation failures in locationActions
- Replace DocumentIcon with TicketIcon for proof-of-payment downloads (consistency)
- Add teal color to all proof-of-payment icons for visual distinction
- Adjust vertical alignment of icons for better visual alignment with text

Debug logging helps troubleshoot:
- shareId extraction failures
- Checksum validation failures
- Location not found errors

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Knee Cola
2025-12-08 01:17:03 +01:00
parent bc336a9744
commit e978a5c2bf
4 changed files with 10 additions and 4 deletions

View File

@@ -253,7 +253,7 @@ export const BillEditForm: FC<BillEditFormProps> = ({ location, bill }) => {
target="_blank"
className='text-center w-full max-w-[20rem] text-nowrap truncate inline-block'
>
<TicketIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1 text-teal-500" />
<TicketIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1 mt-[-.2em] text-teal-500" />
{decodeURIComponent(proofOfPayment.fileName)}
</Link>
</div>

View File

@@ -134,7 +134,7 @@ export const ViewBillCard: FC<ViewBillCardProps> = ({ location, bill, shareId })
target="_blank"
className='text-center w-full max-w-[20rem] text-nowrap truncate inline-block'
>
<TicketIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1" />
<TicketIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1 mt-[-.1em] text-teal-500" />
{ decodeURIComponent(proofOfPaymentFilename) }
</Link>
</div>

View File

@@ -10,9 +10,10 @@ import { ViewBillBadge } from "./ViewBillBadge";
import { Pdf417Barcode } from "./Pdf417Barcode";
import { EncodePayment, PaymentParams } from "hub-3a-payment-encoder";
import Link from "next/link";
import { DocumentIcon, LinkIcon } from "@heroicons/react/24/outline";
import { LinkIcon } from "@heroicons/react/24/outline";
import { uploadUtilBillsProofOfPayment } from "../lib/actions/locationActions";
import QRCode from "react-qr-code";
import { TicketIcon } from "@heroicons/react/24/solid";
export interface ViewLocationCardProps {
location: BillingLocation;
@@ -199,7 +200,7 @@ export const ViewLocationCard: FC<ViewLocationCardProps> = ({ location, userSett
target="_blank"
className='text-center w-full max-w-[20rem] text-nowrap truncate inline-block'
>
<DocumentIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1" />
<TicketIcon className="h-[1em] w-[1em] text-2xl inline-block mr-1 mt-[-.1em] text-teal-500" />
{decodeURIComponent(attachmentFilename)}
</Link>
</div>