Marco/infoalloggi-monorepo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 6 Wiki Activity Actions

feat: add Head component for dynamic title and enhance contact information display

Browse source
This commit is contained in:
Marco Pedone 2025-09-01 11:36:38 +02:00
parent ece58b7c3b
commit 06e156c314
1 changed files with 26 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

74
apps/infoalloggi/src/components/schedaAnnuncioStampabile.tsx
View file

@ -1,5 +1,6 @@
"use client"; "use client";
import Head from "next/head";
import { useRef } from "react"; import { useRef } from "react";
import { useReactToPrint } from "react-to-print"; import { useReactToPrint } from "react-to-print";
import { Button } from "~/components/ui/button"; import { Button } from "~/components/ui/button";
@ -11,9 +12,7 @@ import { replaceWithBr } from "~/lib/newlineToBr";
import type { Annunci } from "~/schemas/public/Annunci"; import type { Annunci } from "~/schemas/public/Annunci";
import { IconMatrix } from "./IconComponents"; import { IconMatrix } from "./IconComponents";
import { LogoSvg } from "./svgs"; import { LogoSvg } from "./svgs";
import { Separator } from "./ui/separator";
//todo finire
export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) { export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) {
const contentRef = useRef<HTMLDivElement>(null); const contentRef = useRef<HTMLDivElement>(null);
const reactToPrintFn = useReactToPrint({ const reactToPrintFn = useReactToPrint({
@ -22,20 +21,25 @@ export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) {
}); });
return ( return (
<div className="mx-auto max-w-4xl"> <>
<div className="space-y-6"> <Head>
<div className="flex items-center justify-between"> <title>Scheda Annuncio {data.codice}</title>
<h1 className="text-2xl font-bold">Scheda Annuncio Stampabile</h1> </Head>
<div className="mx-auto max-w-4xl">
<div className="space-y-6">
<div className="flex items-center justify-between">
<h1 className="text-2xl font-bold">Scheda Annuncio Stampabile</h1>
<Button className="print:hidden" onClick={() => reactToPrintFn()}> <Button className="print:hidden" onClick={() => reactToPrintFn()}>
Stampa Stampa
</Button> </Button>
</div> </div>
<div ref={contentRef}> <div ref={contentRef}>
<SchedaAnnuncio data={data} /> <SchedaAnnuncio data={data} />
</div>
</div> </div>
</div> </div>
</div> </>
); );
} }
@ -197,7 +201,15 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
)} )}
</div> </div>
</div> </div>
<div className="bg-primary/5 p-4 rounded-lg">
<h3 className="text-lg font-semibold text-primary mb-2">
📞 Contatti
</h3>
<div className="text-sm space-y-1">
<p>{data.locatore}</p>
{data.numero && <p>Tel. {data.numero}</p>}
</div>
</div>
{/* Description */} {/* Description */}
{data.desc_it && ( {data.desc_it && (
<> <>
@ -216,40 +228,6 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
</> </>
)} )}
{/* Energy Information */}
{data.classe && (
<>
<Separator />
<div className="space-y-3">
<h3 className="text-lg font-semibold border-b pb-1">
⚡ Prestazione Energetica
</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
{data.classe && (
<p>
<span className="font-medium">Classe Energetica:</span>{" "}
{data.classe}
</p>
)}
</div>
</div>
</>
)}
{/* Contact Information */}
<Separator />
<div className="bg-primary/5 p-4 rounded-lg">
<h3 className="text-lg font-semibold text-primary mb-2">
📞 Contatti
</h3>
<div className="text-sm space-y-1">
<p>{data.locatore}</p>
{data.numero && <p>Tel. {data.numero}</p>}
</div>
</div>
<Separator />
<div className="text-muted-foreground pt-2 text-center text-xs"> <div className="text-muted-foreground pt-2 text-center text-xs">
<p>{footer}</p> <p>{footer}</p>
<p className="mt-1"> <p className="mt-1">