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

Increase the size and boldness of the timer

Browse Source
This commit is contained in:
Tiago Ribeiro
2024-08-28 14:58:07 +01:00
parent 6fd0b7aef3
commit af9462398a
2 changed files with 65 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/Medium/Timer.tsx
View File

@@ -1,9 +1,9 @@
import useExamStore from "@/stores/examStore"; import useExamStore from "@/stores/examStore";
import { useEffect, useState } from "react"; import {useEffect, useState} from "react";
import { motion } from "framer-motion"; import {motion} from "framer-motion";
import TimerEndedModal from "../TimerEndedModal"; import TimerEndedModal from "../TimerEndedModal";
import clsx from "clsx"; import clsx from "clsx";
import { BsStopwatch } from "react-icons/bs"; import {BsStopwatch} from "react-icons/bs";
interface Props { interface Props {
minTimer: number; minTimer: number;
@@ -17,7 +17,7 @@ const Timer: React.FC<Props> = ({minTimer, disableTimer, standalone = false}) =>
const [warningMode, setWarningMode] = useState(false); const [warningMode, setWarningMode] = useState(false);
const setHasExamEnded = useExamStore((state) => state.setHasExamEnded); const setHasExamEnded = useExamStore((state) => state.setHasExamEnded);
const { timeSpent } = useExamStore((state) => state); const {timeSpent} = useExamStore((state) => state);
useEffect(() => setTimer((prev) => prev - timeSpent), [timeSpent]); useEffect(() => setTimer((prev) => prev - timeSpent), [timeSpent]);
@@ -54,11 +54,11 @@ const Timer: React.FC<Props> = ({minTimer, disableTimer, standalone = false}) =>
standalone ? "top-10" : "top-4", standalone ? "top-10" : "top-4",
warningMode && !disableTimer && "bg-mti-red-light text-mti-gray-seasalt", warningMode && !disableTimer && "bg-mti-red-light text-mti-gray-seasalt",
)} )}
initial={{ scale: warningMode && !disableTimer ? 0.8 : 1 }} initial={{scale: warningMode && !disableTimer ? 0.8 : 1}}
animate={{ scale: warningMode && !disableTimer ? 1.1 : 1 }} animate={{scale: warningMode && !disableTimer ? 1.1 : 1}}
transition={{ repeat: Infinity, repeatType: "reverse", duration: 0.5, ease: "easeInOut" }}> transition={{repeat: Infinity, repeatType: "reverse", duration: 0.5, ease: "easeInOut"}}>
<BsStopwatch className="w-6 h-6" /> <BsStopwatch className="w-6 h-6" />
<span className="text-base font-semibold w-12"> <span className="text-lg font-bold w-12">
{timer > 0 && ( {timer > 0 && (
<> <>
{Math.floor(timer / 60) {Math.floor(timer / 60)
@@ -75,6 +75,6 @@ const Timer: React.FC<Props> = ({minTimer, disableTimer, standalone = false}) =>
</motion.div> </motion.div>
</> </>
); );
} };
export default Timer; export default Timer;

5
src/dashboards/MasterCorporate.tsx
View File

@@ -437,7 +437,6 @@ export default function MasterCorporateDashboard({ user }: Props) {
const { data: stats } = useFilterRecordsByUser<Stat[]>(); const { data: stats } = useFilterRecordsByUser<Stat[]>();
const { users, reload } = useUsers(); const { users, reload } = useUsers();
const { codes } = useCodes(user.id);
const { groups } = useGroups({ admin: user.id, userType: user.type }); const { groups } = useGroups({ admin: user.id, userType: user.type });
const { balance } = useUserBalance(); const { balance } = useUserBalance();
@@ -447,9 +446,9 @@ export default function MasterCorporateDashboard({ user }: Props) {
), ),
], [groups, user.id]); ], [groups, user.id]);
const corporateUserGroups = [ const corporateUserGroups = useMemo(() => [
...new Set(groups.flatMap((g) => g.participants)), ...new Set(groups.flatMap((g) => g.participants)),
]; ], [groups])
const { const {
assignments, assignments,