import * as React from 'react';
import { Text, View } from '@react-pdf/renderer';

import { styles } from '../styles';

export function Footer(props: { locale: 'en' | 'de'; siteUrl?: string }): React.ReactElement {
  const date = new Date().toLocaleDateString(props.locale === 'en' ? 'en-US' : 'de-DE', {
    year: 'numeric',
    month: 'long',
    day: 'numeric',
  });

  const siteUrl = props.siteUrl || 'https://klz-cables.com';

  return (
    <View style={styles.footer} fixed>
      <Text style={styles.footerBrand}>KLZ CABLES</Text>
      <Text style={styles.footerText}>{date}</Text>
      <Text style={styles.footerText} render={({ pageNumber, totalPages }) => `${pageNumber} / ${totalPages}`} />
    </View>
  );
}