/* eslint-disable jsx-a11y/alt-text */
import React from "react";

import {View, Text, Image} from "@react-pdf/renderer";
import {styles} from "../styles";
import {ModuleScore} from "@/interfaces/module.scores";

export const RadialResult = ({module, score, total, png}: ModuleScore) => (
	<View style={[styles.textFont, styles.radialContainer]}>
		<Text style={[styles.textColor, styles.textBold, {fontSize: 10}]}>{module}</Text>
		<Image src={png} style={styles.image64}></Image>
		<View style={[styles.textColor, styles.radialResultContainer]}>
			<Text style={styles.textBold}>{score.toFixed(2)}</Text>
			<Text style={{fontSize: 8}}>out of {total}</Text>
		</View>
	</View>
);
