"use client";

import * as React from "react";
import {
  Page as PDFPage,
  Document as PDFDocument,
  Image as PDFImage,
  StyleSheet,
  View as PDFView,
  Text as PDFText,
} from "@react-pdf/renderer";
import {
  FrontPageModule,
  SitemapModule,
  EstimationModule,
  TransparenzModule,
  ClosingModule,
  SimpleLayout,
  pdfStyles,
  calculatePositions,
} from "@mintel/pdf";

// Local styles for QR Code overlay
const styles = StyleSheet.create({
  qrContainer: {
    position: "absolute",
    bottom: 40,
    right: 40,
    width: 60,
    height: 60,
    alignItems: "center",
    justifyContent: "center",
  },
  qrImage: {
    width: "100%",
    height: "100%",
  },
  qrLabel: {
    fontSize: 8,
    color: "#94a3b8", // slate-400
    marginTop: 4,
    textAlign: "center",
  },
});

interface PDFProps {
  state: any;
  totalPrice: number;
  monthlyPrice?: number;
  totalPagesCount?: number;
  pricing: any;
  headerIcon?: string;
  footerLogo?: string;
  qrCodeData?: string;
}

export const LocalEstimationPDF = ({
  state,
  totalPrice,
  pricing,
  headerIcon,
  footerLogo,
  qrCodeData,
}: PDFProps) => {
  const date = new Date().toLocaleDateString("de-DE", {
    year: "numeric",
    month: "long",
    day: "numeric",
  });

  const positions = calculatePositions(state, pricing);

  const companyData = {
    name: "Marc Mintel",
    address1: "Georg-Meistermann-Straße 7",
    address2: "54586 Schüller",
    ustId: "DE367588065",
  };

  const commonProps = {
    state,
    date,
    icon: headerIcon,
    footerLogo,
    companyData,
  };

  let pageCounter = 1;
  const getPageNum = () => (pageCounter++).toString().padStart(2, "0");

  return (
    <PDFDocument title={`Angebot - ${state.companyName || "Projekt"}`}>
      <PDFPage size="A4" style={pdfStyles.titlePage}>
        <FrontPageModule state={state} headerIcon={headerIcon} date={date} />
        {qrCodeData && (
          <PDFView style={styles.qrContainer}>
            <PDFImage src={qrCodeData} style={styles.qrImage} />
            <PDFText style={styles.qrLabel}>Scan me</PDFText>
          </PDFView>
        )}
      </PDFPage>

      {/* BriefingModule Page REMOVED as per user request ("die zweite seite ist leer, weg damit") */}

      {state.sitemap && state.sitemap.length > 0 && (
        // @ts-ignore
        <SimpleLayout {...commonProps} pageNumber={getPageNum()}>
          <SitemapModule state={state} />
        </SimpleLayout>
      )}

      {/* @ts-ignore */}
      <SimpleLayout {...commonProps} pageNumber={getPageNum()}>
        <EstimationModule
          state={state}
          positions={positions}
          totalPrice={totalPrice}
          date={date}
        />
      </SimpleLayout>

      {/* @ts-ignore */}
      <SimpleLayout {...commonProps} pageNumber={getPageNum()}>
        <TransparenzModule pricing={pricing} />
      </SimpleLayout>

      {/* @ts-ignore */}
      <SimpleLayout {...commonProps} pageNumber={getPageNum()}>
        <ClosingModule />
      </SimpleLayout>
    </PDFDocument>
  );
};