import React from 'react'; import { Box, Stack, Heading } from '@chakra-ui/react'; import { Certification } from '../types/cv'; import { CertificationImport } from './CertificationImport'; // Import Patternfly component import PatternflyTextInput from './PatternflyTextInput'; // @ts-ignore import RedHatButton from './RedHatButton'; // Red Hat brand colors const colors = { red: "#ee0000", redHover: "#cc0000", redActive: "#a30000", blue: "#0066cc", blueHover: "#004080", blueActive: "#002952", gray: { light: "#f5f5f5", medium: "#d2d2d2", dark: "#4c4c4c" } }; interface CertificationsFormProps { certifications: Certification[]; onAddCertification: () => void; onUpdateCertification: (index: number, certification: Partial) => void; onRemoveCertification: (index: number) => void; onImportCertifications: (csvContent: string) => { success: boolean; count?: number; error?: string }; } export const CertificationsForm: React.FC = ({ certifications, onAddCertification, onUpdateCertification, onRemoveCertification, onImportCertifications }) => { return ( Training and Certifications {/* CSV Import Section */} {/* Manual Entry Section */} {certifications.map((certification, index) => ( ) => onUpdateCertification(index, { qualification: e.target.value })} name={`certification-${index}-qualification`} isRequired helperText="Certificate name or qualification title" /> ) => onUpdateCertification(index, { date: e.target.value })} name={`certification-${index}-date`} isRequired helperText="Date of completion (YYYY-MM-DD or YYYY-MM)" /> onRemoveCertification(index)} > Remove Certification ))} Add Certification ); };