89c06e2799
Database & Types: - Added hub3aText field to Bill interface in db-types.ts - Marked barcodeImage as @deprecated legacy field Server Actions: - Updated billActions to read/write hub3aText instead of barcodeImage - Commented out legacy barcodeImage code with migration notes Barcode Decoder: - Renamed image2canvas to file2canvas for clarity - Added new image2canvas function for base64 encoded images (migration support) - Added hub3aText to DecodeResult type - Exported decodeFromImage function for legacy data migration - Updated decoding logic to extract and return hub3aText UI Components: - Refactored Pdf417Barcode to accept hub3aText string instead of PaymentParams - Removed EncodePayment call from Pdf417Barcode (now expects pre-encoded text) - Updated ViewLocationCard to encode payment params before passing to Pdf417Barcode This completes the refactoring from storing bitmap images to storing decoded HUB-3A payment strings, providing more efficient storage and easier data manipulation. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
import { useState, useEffect, FC } from 'react';
|
|
import { generateBarcode } from '../lib/pdf/pdf417';
|
|
import { renderBarcode } from '../lib/pdf/renderBarcode';
|
|
import { EncodePayment, PaymentParams } from 'hub-3a-payment-encoder';
|
|
|
|
export const Pdf417Barcode:FC<{hub3aText:string}> = ({hub3aText: hub3a_text}) => {
|
|
const [bitmapData, setBitmapData] = useState<string | undefined>(undefined);
|
|
|
|
useEffect(() => {
|
|
const barcodeMatrix = generateBarcode(hub3a_text);
|
|
const bitmap = renderBarcode(barcodeMatrix, 2, 2);
|
|
setBitmapData(bitmap);
|
|
}, [hub3a_text]);
|
|
|
|
// Don't render until bitmap is generated (prevents hydration mismatch)
|
|
if (!bitmapData) {
|
|
return (
|
|
<div style={{ width: "350px", height: "92px" }} className="flex items-center justify-center">
|
|
<span className="loading loading-spinner loading-lg"></span>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<img src={bitmapData} style={{ width: "350px", height: "92px" }} />
|
|
</div>
|
|
);
|
|
} |