difftastic/sample_files/whitespace_1.tsx

49 lines
1.3 KiB
TypeScript

const AttachmentInput: FC<AttachmentInputProps> = ({
title,
accept,
setFiles,
files,
name,
isInvalid,
}) => {
return (
<div style={STYLES.attachmentInput} data-testid="attachment-input">
<span style={STYLES.title}>{title}</span>
<DropZone
accept={accept}
onNewFiles={onNewFiles}
multiple
name={name}
isInvalid={isInvalid}
>
<Button variant="outline-secondary" className="my-1">
<FontAwesomeIcon icon={faPlus} /> Adicionar arquivos{" "}
</Button>
</DropZone>{" "}
{files.length > 0 && (
<div data-testid="attachment-files-names">
<div className="ml-1" style={STYLES.toBeSentLabel}>
{"Arquivos a enviar: "}
</div>
{files.map((file) => (
<Badge
variant="secondary"
key={file.name}
className="mr-1 px-3"
style={STYLES.badge}
>
<div style={STYLES.badgeText}>{file.name}</div>
<FontAwesomeIcon
icon={faTimes}
className="ml-2"
data-testid="attachment-files-remove"
onClick={() => onFileRemoved(file)}
/>
</Badge>
))}
</div>
)}
</div>
);
};