diff --git a/modules/StudySession/components/GameStatus.tsx b/modules/StudySession/components/GameStatus.tsx new file mode 100644 index 0000000..22e080b --- /dev/null +++ b/modules/StudySession/components/GameStatus.tsx @@ -0,0 +1,39 @@ +import React from "react"; + +import { Box, Stack, StackProps, Text } from "@chakra-ui/react"; + +interface ResultBoxProps { + amount: number; + type: "correct" | "incorrect"; +} +interface GameStatusProps extends StackProps { + correct: number; + incorrect: number; + total: number; +} + +const ResultBox: React.FC = ({ amount, type }) => { + const bgColor = type === "correct" ? "status.success" : "status.error"; + const label = `${amount} ${type === "correct" ? "Correctas" : "Incorrectas"}`; + return ( + + {label} + + ); +}; + +const GameStatus: React.FC = ({ correct, incorrect, total, ...props }) => { + const progressText = `${correct + incorrect}/${total}`; + return ( + + + + + {progressText} + + + + + ); +}; +export default GameStatus;