devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Renamed to setup for group testing

Browse Source
This commit is contained in:
Joao Ramos
2024-01-08 22:19:48 +00:00
parent cd8860f6ac
commit 2540398ab0
3 changed files with 37 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

221
src/exams/pdf/test.report.tsx Normal file
View File

@@ -0,0 +1,221 @@
/* eslint-disable jsx-a11y/alt-text */
import React from "react";
import { Document, Page, View, Text, Image } from "@react-pdf/renderer";
import ProgressBar from "./progress.bar";
import { ModuleScore } from "@/interfaces/module.scores";
import { styles } from "./styles";
import { StyleSheet } from "@react-pdf/renderer";
const customStyles = StyleSheet.create({
testDetails: {
display: "flex",
gap: 4,
},
qrcode: {
width: "80px",
height: "80px",
},
});
interface Props {
date: string;
name: string;
email: string;
id: string;
gender?: string;
testDetails: ModuleScore[];
summary: string;
logo: string;
qrcode: string;
renderDetails: React.ReactNode;
title: string;
}
const TestReport = ({
title,
date,
name,
email,
id,
gender,
testDetails,
summary,
logo,
qrcode,
renderDetails,
}: Props) => {
const defaultTextStyle = [styles.textFont, { fontSize: 8 }];
const defaultSkillsTextStyle = [styles.textFont, { fontSize: 8 }];
const defaultSkillsTitleStyle = [
styles.textFont,
styles.textColor,
styles.textBold,
{ fontSize: 7 },
];
return (
<Document>
<Page style={styles.body}>
<View style={styles.alignRightRow}>
<Image src={logo} fixed style={styles.image64} />
</View>
<View style={styles.titleView}>
<Text
style={[
styles.textFont,
styles.textBold,
styles.textColor,
styles.textUnderline,
styles.title,
{ fontSize: 14 },
]}
>
{title}
</Text>
</View>
<View style={styles.textPadding}>
<Text style={defaultTextStyle}>Date of Test: {date}</Text>
</View>
<Text style={[styles.textFont, styles.textBold, { fontSize: 11 }]}>
Candidate Information:
</Text>
<View style={styles.textPadding}>
<Text style={defaultTextStyle}>Name: {name}</Text>
<Text style={defaultTextStyle}>ID: {id}</Text>
<Text style={defaultTextStyle}>Email: {email}</Text>
<Text style={defaultTextStyle}>Gender: {gender}</Text>
</View>
<View style={{ flex: 1 }}>
<Text
style={[
styles.textFont,
styles.textBold,
styles.textColor,
{ fontSize: 12 },
]}
>
Test Details:
</Text>
<View>{renderDetails}</View>
</View>
<View>
<Text
style={[
styles.textFont,
styles.textBold,
styles.textColor,
{ fontSize: 12 },
]}
>
Performance Summary
</Text>
<View>
<Text style={[styles.textFont, { fontSize: 8 }]}>{summary}</Text>
</View>
</View>
<View style={[{ paddingTop: 30 }, styles.separator]}></View>
<View>
<Text
style={[
styles.textFont,
styles.textBold,
styles.textColor,
styles.textUnderline,
{ fontSize: 12, paddingTop: 10 },
]}
>
Skills Feedback
</Text>
<View
style={{
paddingTop: 10,
gap: 8,
}}
>
{testDetails
.filter(({ suggestions, evaluation }) => suggestions || evaluation)
.map(({ module, suggestions, evaluation }) => (
<View key={module} style={customStyles.testDetails}>
<Text style={[...defaultSkillsTitleStyle, styles.textBold]}>
{module}
</Text>
<Text style={defaultSkillsTextStyle}>{evaluation}</Text>
<Text style={defaultSkillsTextStyle}>{suggestions}</Text>
</View>
))}
</View>
<View style={styles.alignRightRow}>
<Image
src={qrcode}
style={customStyles.qrcode}
/>
</View>
</View>
<View style={[{ paddingBottom: 30 }, styles.separator]}></View>
{false && (
<View>
<ProgressBar
width={200}
height={18}
backgroundColor="#cc5b55"
progressColor="#fab7b0"
percentage={60}
/>
</View>
)}
<View style={{ flexGrow: 1 }}></View>
<View style={[{ paddingTop: 30, fontSize: 5 }, styles.textFont]}>
<View
style={[
styles.spacedRow,
{
paddingHorizontal: 10,
},
]}
>
<View>
<Text>Validity</Text>
<Text>
This report remains valid for a duration of three months from
the test date.
</Text>
</View>
<View>
<Text>Confidential – circulated for concern people</Text>
</View>
</View>
<View style={{ paddingTop: 10 }}>
<Text>Declaration</Text>
<Text style={{ paddingTop: 5 }}>
We hereby declare that exam results on our platform, assessed by
AI, are not the sole determinants of candidates&apos; English
proficiency levels. While EnCoach provides feedback based on
assessments, we recognize that language proficiency encompasses
practical application, cultural understanding, and real-life
communication. We urge users to consider exam results as a measure
of progress and improvement, and we continuously enhance our
system to ensure accuracy and reliability.
</Text>
</View>
<View style={[styles.textColor, { paddingTop: 5 }]}>
<Text style={styles.textUnderline}>info@encoach.com</Text>
<Text>https://encoach.com</Text>
<View style={styles.spacedRow}>
<Text>Group ID: TRI64BNBOIU5043</Text>
<Text
// style={styles.pageNumber}
render={({ pageNumber, totalPages }) =>
`${pageNumber} / ${totalPages}`
}
fixed
/>
</View>
</View>
</View>
</Page>
</Document>
);
};
export default TestReport;