revert: restore legacy PDF417 barcode generation implementation

Restore custom PDF417 generator, renderer, and component that were previously removed. Update all components to use the legacy Pdf417Barcode instead of Pdf417BarcodeWasm.

Restored files:
- app/lib/pdf/pdf417.ts - Custom PDF417 generator library
- app/lib/pdf/renderBarcode.ts - Canvas-based barcode renderer
- app/ui/Pdf417Barcode.tsx - React component using custom generator

Updated imports in:
- app/ui/BillEditForm.tsx
- app/ui/PrintPreview.tsx
- app/ui/ViewBillCard.tsx
- app/ui/ViewLocationCard.tsx

🤖 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-21 20:52:04 +01:00
parent c22c1fb7fb
commit 1e8a817fcc
7 changed files with 1145 additions and 8 deletions

View File

@@ -10,7 +10,7 @@ import { formatYearMonth } from "../lib/format";
import { DecodeResult, findDecodePdf417 } from "../lib/pdf/barcodeDecoderWasm";
import { useLocale, useTranslations } from "next-intl";
import { InfoBox } from "./InfoBox";
import { Pdf417BarcodeWasm } from "./Pdf417BarcodeWasm";
import { Pdf417Barcode } from "./Pdf417Barcode";
// Next.js does not encode an utf-8 file name correctly when sending a form with a file attachment
// This is a workaround for that
@@ -203,7 +203,7 @@ export const BillEditForm: FC<BillEditFormProps> = ({ location, bill }) => {
hub3aText ?
<div className="form-control p-1">
<label className="label p-2 grow bg-white border border-gray-300 rounded-box justify-center">
<Pdf417BarcodeWasm hub3aText={hub3aText} />
<Pdf417Barcode hub3aText={hub3aText} />
</label>
<p className="text-xs my-1">{t.rich('barcode-disclaimer', { br: () => <br /> })}</p>
</div> : null

33
app/ui/Pdf417Barcode.tsx Normal file
View File

@@ -0,0 +1,33 @@
'use client';
import { useState, useEffect, FC } from 'react';
import { generateBarcode } from '../lib/pdf/pdf417';
import { renderBarcode } from '../lib/pdf/renderBarcode';
export const Pdf417Barcode:FC<{hub3aText:string, className?: string, errorCorrectionLevel?: number}> = ({ hub3aText: hub3a_text, className, errorCorrectionLevel = 3}) => {
const [bitmapData, setBitmapData] = useState<string | undefined>(undefined);
console.log("Rendering Pdf417Barcode with hub3a_text:", hub3a_text);
useEffect(() => {
const aspectRatio = 3;
const barcodeMatrix = generateBarcode(hub3a_text, errorCorrectionLevel , aspectRatio);
const bitmap = renderBarcode(barcodeMatrix, 1, 1);
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 (
// eslint-disable-next-line @next/next/no-img-element
<img src={bitmapData} alt="PDF417 Barcode" className={className} />
);
}

View File

@@ -1,7 +1,7 @@
'use client';
import { PrintBarcodeData } from '../lib/actions/printActions';
import { Pdf417BarcodeWasm } from './Pdf417BarcodeWasm';
import { Pdf417Barcode } from './Pdf417Barcode';
export interface PrintPreviewProps {
data: PrintBarcodeData[];
@@ -132,7 +132,7 @@ export const PrintPreview: React.FC<PrintPreviewProps> = ({ data, year, month, t
<td className="border-2 border-gray-800 px-3 py-1.5 text-center">
<div className="flex justify-center items-center">
{
item.hub3aText ? <Pdf417BarcodeWasm hub3aText={item.hub3aText} className="print:m-[5em_auto]" /> : null
item.hub3aText ? <Pdf417Barcode hub3aText={item.hub3aText} /> : null
}
</div>
</td>

View File

@@ -8,7 +8,7 @@ import { useRouter } from "next/navigation";
import { formatYearMonth } from "../lib/format";
import { useTranslations } from "next-intl";
import { uploadProofOfPayment } from "../lib/actions/billActions";
import { Pdf417BarcodeWasm } from "./Pdf417BarcodeWasm";
import { Pdf417Barcode } from "./Pdf417Barcode";
export interface ViewBillCardProps {
location: BillingLocation;
@@ -111,7 +111,7 @@ export const ViewBillCard: FC<ViewBillCardProps> = ({ location, bill, shareId })
hub3aText ?
<div className="form-control p-1">
<label className="label p-2 grow bg-white border border-gray-300 rounded-box justify-center">
<Pdf417BarcodeWasm hub3aText={hub3aText} />
<Pdf417Barcode hub3aText={hub3aText} />
</label>
<p className="text-xs my-1">{t.rich('barcode-disclaimer', { br: () => <br /> })}</p>
</div> : null

View File

@@ -13,7 +13,7 @@ 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";
import { Pdf417BarcodeWasm } from "./Pdf417BarcodeWasm";
import { Pdf417Barcode } from "./Pdf417Barcode";
export interface ViewLocationCardProps {
location: BillingLocation;
@@ -153,7 +153,7 @@ export const ViewLocationCard: FC<ViewLocationCardProps> = ({ location, userSett
<li><strong>{t("payment-reference-label")}</strong><pre className="inline pl-1">{paymentParams.PozivNaBroj}</pre></li>
</ul>
<label className="label p-2 grow bg-white border border-gray-300 rounded-box justify-center">
<Pdf417BarcodeWasm hub3aText={hub3aText} />
<Pdf417Barcode hub3aText={hub3aText} />
</label>
</>
: null