45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
|
import { Box, SxProps, Theme, Typography, useTheme } from "@mui/material";
|
||
|
|
import { UserDocument } from "@root/model/user";
|
||
|
|
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
text: string;
|
||
|
|
document: UserDocument;
|
||
|
|
sx?: SxProps<Theme>;
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function DocumentItem({ text, document, sx }: Props) {
|
||
|
|
const theme = useTheme();
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Box sx={{
|
||
|
|
display: "flex",
|
||
|
|
flexDirection: "column",
|
||
|
|
alignItems: "start",
|
||
|
|
gap: "10px",
|
||
|
|
...sx,
|
||
|
|
}}>
|
||
|
|
<Typography sx={{
|
||
|
|
color: "#4D4D4D",
|
||
|
|
fontWeight: 500,
|
||
|
|
fontVariantNumeric: "tabular-nums",
|
||
|
|
}}>{text}</Typography>
|
||
|
|
{document.uploadedFileName &&
|
||
|
|
<Typography sx={{
|
||
|
|
color: theme.palette.brightPurple.main,
|
||
|
|
}}>{document.uploadedFileName}</Typography>
|
||
|
|
}
|
||
|
|
{document.imageSrc &&
|
||
|
|
<img
|
||
|
|
src={document.imageSrc}
|
||
|
|
alt="document"
|
||
|
|
style={{
|
||
|
|
maxWidth: "80px",
|
||
|
|
maxHeight: "200px",
|
||
|
|
objectFit: "contain",
|
||
|
|
display: "block",
|
||
|
|
}}
|
||
|
|
/>}
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|