Updated the register to only allow to create users if they have a code available

This commit is contained in:
Tiago Ribeiro
2023-10-03 23:53:54 +01:00
parent 1ccb9555b6
commit 29914d3e89
5 changed files with 119 additions and 26 deletions

View File

@@ -19,6 +19,8 @@ import {Chart} from "react-chartjs-2";
import useUsers from "@/hooks/useUsers";
import Select from "react-select";
import useGroups from "@/hooks/useGroups";
import DatePicker from "react-datepicker";
import moment from "moment";
ChartJS.register(LinearScale, CategoryScale, PointElement, LineElement, LineController, Legend, Tooltip);
@@ -45,6 +47,8 @@ export const getServerSideProps = withIronSessionSsr(({req, res}) => {
export default function Stats() {
const [statsUserId, setStatsUserId] = useState<string>();
const [startDate, setStartDate] = useState<Date | null>(null);
const [endDate, setEndDate] = useState<Date | null>(new Date());
const {user} = useUser({redirectTo: "/login"});
const {users} = useUsers();
@@ -56,6 +60,17 @@ export default function Stats() {
if (user) setStatsUserId(user.id);
}, [user]);
useEffect(() => {
if (stats && stats.length > 0) {
const sortedStats = stats.sort((a, b) => a.date - b.date);
const firstStat = sortedStats.shift()!;
setStartDate(moment.unix(firstStat.date).toDate());
console.log(stats.filter((x) => moment.unix(x.date).isAfter(startDate)));
console.log(stats.filter((x) => moment.unix(x.date).isBefore(endDate)));
}
}, [stats]);
const calculateTotalScorePerSession = () => {
const groupedBySession = groupBySession(stats);
const sessionAverage = Object.keys(groupedBySession).map((x: string) => {
@@ -160,22 +175,53 @@ export default function Stats() {
</section>
{stats.length > 0 && (
<section className="flex flex-col gap-3">
{(user.type === "developer" || user.type === "owner") && (
<Select
options={users.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}}
onChange={(value) => setStatsUserId(value?.value)}
<div className="w-full flex justify-between gap-8 items-center">
<>
{(user.type === "developer" || user.type === "owner") && (
<Select
className="w-full"
options={users.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}}
onChange={(value) => setStatsUserId(value?.value)}
styles={{
option: (styles, state) => ({
...styles,
backgroundColor: state.isFocused ? "#D5D9F0" : state.isSelected ? "#7872BF" : "white",
color: state.isFocused ? "black" : styles.color,
}),
}}
/>
)}
{(user.type === "admin" || user.type === "teacher") && groups.length > 0 && (
<Select
className="w-full"
options={users
.filter((x) => groups.flatMap((y) => y.participants).includes(x.id))
.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}}
onChange={(value) => setStatsUserId(value?.value)}
styles={{
option: (styles, state) => ({
...styles,
backgroundColor: state.isFocused ? "#D5D9F0" : state.isSelected ? "#7872BF" : "white",
color: state.isFocused ? "black" : styles.color,
}),
}}
/>
)}
</>
<DatePicker
dateFormat="dd/MM/yyyy"
startDate={startDate}
endDate={endDate}
selectsRange
filterDate={(date) => !moment(date).isSameOrBefore(moment(startDate))}
onChange={([initialDate, finalDate]) => {
setStartDate(initialDate);
setEndDate(finalDate);
}}
/>
)}
{(user.type === "admin" || user.type === "teacher") && groups.length > 0 && (
<Select
options={users
.filter((x) => groups.flatMap((y) => y.participants).includes(x.id))
.map((x) => ({value: x.id, label: `${x.name} - ${x.email}`}))}
defaultValue={{value: user.id, label: `${user.name} - ${user.email}`}}
onChange={(value) => setStatsUserId(value?.value)}
/>
)}
</div>
<div className="flex gap-4 flex-wrap">
{/* Exams per module */}
<div className="flex flex-col gap-12 border w-full h-fit max-w-xs border-mti-gray-platinum p-4 pb-12 rounded-xl">
@@ -319,7 +365,13 @@ export default function Stats() {
<Chart
type="line"
data={{
labels: Object.keys(groupBySession(stats)).map((_, index) => index),
labels: Object.keys(
groupBySession(
stats.filter(
(x) => moment.unix(x.date).isAfter(startDate) && moment.unix(x.date).isBefore(endDate),
),
),
).map((_, index) => index),
datasets: [
{
type: "line",
@@ -342,7 +394,13 @@ export default function Stats() {
<Chart
type="line"
data={{
labels: Object.keys(groupBySession(stats)).map((_, index) => index),
labels: Object.keys(
groupBySession(
stats.filter(
(x) => moment.unix(x.date).isAfter(startDate) && moment.unix(x.date).isBefore(endDate),
),
),
).map((_, index) => index),
datasets: [
...MODULE_ARRAY.map((module, index) => ({
type: "line" as const,