/* 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";
import {calculateBandScore} from "@/utils/score";
import {Module} from "@/interfaces";

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}>
				{module === "level" ? Math.floor(score) : calculateBandScore(score, total, module.toLowerCase() as Module | "overall", "general")}
			</Text>
			<Text style={{fontSize: 8}}>out of 9.0</Text>
		</View>
	</View>
);