import React from "react";
import { styles } from "./styles";
import { View, Text } from "@react-pdf/renderer";

interface Props {
  userId?: string;
}

const TestReportFooter = ({ userId }: Props) => (
  <View
    style={[
      {
        paddingTop: 30,
        fontSize: 5,
        position: "absolute",
        bottom: 30,
        left: 35,
        right: 35,
      },
      styles.textFont,
    ]}
  >
    <View style={[styles.spacedRow, styles.textMargin]}>
      <View>
        <Text style={styles.textBold}>Validity</Text>
        <Text>
          This report remains valid for a duration of three months from the test
          date.
        </Text>
      </View>
      <View>
        <Text style={styles.textBold}>
          Confidential –{" "}
          <Text style={[styles.textFont, styles.textNormal]}>
            circulated for concern people
          </Text>
        </Text>
      </View>
    </View>
    <View>
      <Text style={styles.textBold}>Declaration</Text>
      <Text style={{ paddingTop: 5 }}>
        We hereby declare that exam results on our platform, assessed by AI, are
        not the sole determinants of candidates&apos; English proficiency
        levels. While EnCoach provides feedback based on assessments, we
        recognize that language proficiency encompasses practical application,
        cultural understanding, and real-life communication. We urge users to
        consider exam results as a measure of progress and improvement, and we
        continuously enhance our system to ensure accuracy and reliability.
      </Text>
    </View>
    <View style={{ paddingTop: 4 }}>
      <Text style={styles.textBold}>
        PDF Version:{" "}
        <Text style={[styles.textFont, styles.textNormal]}>
          {process.env.PDF_VERSION}
        </Text>
      </Text>
    </View>
    {userId && (
      <View>
        <Text style={styles.textBold}>
          User ID:{" "}
          <Text style={[styles.textFont, styles.textNormal]}>{userId}</Text>
        </Text>
      </View>
    )}
    <View style={[styles.textColor, { paddingTop: 5 }]}>
      <Text style={styles.textUnderline}>info@encoach.com</Text>
      <Text>https://encoach.com</Text>
      <View style={styles.spacedRow}>
        <Text
          // style={styles.pageNumber}
          render={({ pageNumber, totalPages }) =>
            `${pageNumber} / ${totalPages}`
          }
          fixed
        />
      </View>
    </View>
  </View>
);

export default TestReportFooter;