diff options
Diffstat (limited to 'pages')
| -rw-r--r-- | pages/game.tsx | 4 | ||||
| -rw-r--r-- | pages/login.tsx | 12 | ||||
| -rw-r--r-- | pages/register.tsx | 22 | ||||
| -rw-r--r-- | pages/user.tsx | 24 |
4 files changed, 41 insertions, 21 deletions
diff --git a/pages/game.tsx b/pages/game.tsx index f03933f..e44a7d9 100644 --- a/pages/game.tsx +++ b/pages/game.tsx @@ -61,7 +61,9 @@ function VoerGame(props: { }); props.io.on("resign", () => { - props.toast("Het potje is opgegeven", "normal", <FlagOutlinedIcon style={{ fontSize: 32 }}/>); + props.toast({ message: "Het potje is opgegeven", + type: "normal", + icon: <FlagOutlinedIcon/>}); }); setIoListeners(true); diff --git a/pages/login.tsx b/pages/login.tsx index e33883f..abfca04 100644 --- a/pages/login.tsx +++ b/pages/login.tsx @@ -20,7 +20,9 @@ function submitLogin(event?: FormEvent<HTMLFormElement>, toast?: toastType) { if ( !formData.email || !formData.password ) { - toast("Vul alsjeblieft alle velden in!", "error", <ReportProblemOutlinedIcon style={{ fontSize: 32 }}/>); + toast({ message: "Vul alsjeblieft alle velden in!", + type: "error", + icon: <ReportProblemOutlinedIcon/>}); return; } @@ -33,10 +35,14 @@ function submitLogin(event?: FormEvent<HTMLFormElement>, toast?: toastType) { .then(() => window.location.pathname = "/") .catch(error => { if (error.response.status === 401) { - toast("Verkeerde gebruikersnaam of wachtwoord!", "error", <VpnKeyIcon style={{ fontSize: 32 }}/>); + toast({ message: "Verkeerde gebruikersnaam of wachtwoord!", + type: "error", + icon: <VpnKeyIcon/>}); return; } - toast("Er is iets fout gegaan", "error", <ErrorOutlineIcon style={{ fontSize: 32 }}/>); + toast({ message: "Er is iets fout gegaan", + type: "error", + icon: <ErrorOutlineIcon/>}); }); } diff --git a/pages/register.tsx b/pages/register.tsx index b6db605..5c0e37b 100644 --- a/pages/register.tsx +++ b/pages/register.tsx @@ -22,7 +22,9 @@ function submitRegister(event?: FormEvent<HTMLFormElement>, toast?: toastType) { if ( !formData.username || !formData.email || !formData.password ) { - toast("Vul alsjeblieft alle velden in!", "error", <ReportProblemOutlinedIcon style={{ fontSize: 32 }}/>); + toast({ message: "Vul alsjeblieft alle velden in!", + type: "error", + icon: <ReportProblemOutlinedIcon/>}); return; } @@ -38,18 +40,26 @@ function submitRegister(event?: FormEvent<HTMLFormElement>, toast?: toastType) { */ if ( formData.username.length < 3 || formData.username.length > 35 ) { - toast("Je gebruikersnaam moet tussen de 3 en 35 letters zijn!", "error", <ReportProblemOutlinedIcon style={{ fontSize: 32 }}/>); + toast({ message: "Ongeldige gebruikersnaam", + description: "Je gebruikersnaam moet tussen de 3 en 35 letters zijn", + type: "error", + icon: <ReportProblemOutlinedIcon/>}); return; } if ( !validateEmail(formData.email) ) { - toast("Vul alsjeblieft een geldig email-adres in!", "error", <ReportProblemOutlinedIcon style={{ fontSize: 32 }}/>); + toast({ message: "Ongeldig email-adres", + type: "error", + icon: <ReportProblemOutlinedIcon/>}); return; } //TODO: wachtwoord max 72 tekens ivm bcrypt if ( !formData.password.match(passwordRegex) ) { - toast("Je wachtwoord moet een hoofdletter, kleine letter en een getal bevatten!", "error", <ReportProblemOutlinedIcon style={{ fontSize: 32 }}/>); + toast({ message: "Ongeldig wachtwoord", + description: "Je wachtwoord moet een hoofdletter, kleine letter en een getal bevatten", + type: "error", + icon: <ReportProblemOutlinedIcon/>}); return; } @@ -65,7 +75,9 @@ function submitRegister(event?: FormEvent<HTMLFormElement>, toast?: toastType) { window.location.pathname = "/"; }) .catch(error => { - toast("Er is iets fout gegaan", "error", <ErrorOutlineIcon style={{ fontSize: 32 }}/>); + toast({ message: "Er is iets fout gegaan", + type: "error", + icon: <ErrorOutlineIcon/>}); console.log(error); }); } diff --git a/pages/user.tsx b/pages/user.tsx index dbad76e..ce870af 100644 --- a/pages/user.tsx +++ b/pages/user.tsx @@ -203,13 +203,13 @@ export default function AccountPage() { "endpoint": "/api/social/unblock", "action": `${user.username} gedeblokkeerd`, "relation": "none", - "icon": <Icon size="32px" path={mdiAccountCancelOutline}/>, + "icon": <Icon size={1} path={mdiAccountCancelOutline}/>, } }[relation] || { "endpoint": "/api/social/block", "action": `${user.username} geblokkeerd`, "relation": "blocked", - "icon": <Icon size="32px" path={mdiAccountCancelOutline}/>, + "icon": <Icon size={1} path={mdiAccountCancelOutline}/>, } axios.request({ @@ -219,9 +219,9 @@ export default function AccountPage() { data: { "id": user?.id } }) .then(() => { - toast(nextRelation.action, - "confirmation", - nextRelation.icon); + toast({ message: nextRelation.action, + type: "confirmation", + icon: nextRelation.icon }); setRelation(nextRelation.relation); }); }}/> @@ -245,25 +245,25 @@ export default function AccountPage() { "endpoint": "/api/social/remove", "action": `${user.username} succesvol verwijderd als vriend`, "relation": "none", - "icon": <Icon size="32px" path={mdiAccountMinusOutline}/>, + "icon": <Icon size={1} path={mdiAccountMinusOutline}/>, }, "outgoing": { "endpoint": "/api/social/remove", "action": `Vriendschapsverzoek naar ${user.username} geannuleerd`, "relation": "none", - "icon": <Icon size="32px" path={mdiAccountMinusOutline}/>, + "icon": <Icon size={1} path={mdiAccountMinusOutline}/>, }, "incoming": { "endpoint": "/api/social/accept", "action": `Vriendschapsverzoek van ${user.username} geaccepteerd`, "relation": "friends", - "icon": <PersonAddOutlinedIcon style={{ fontSize: 32 }}/>, + "icon": <PersonAddOutlinedIcon/>, }, }[relation] || { "endpoint": "/api/social/request", "action": `Vriendschapsverzoek gestuurd naar ${user.username}`, "relation": "outgoing", - "icon": <PersonAddOutlinedIcon style={{ fontSize: 32 }}/>, + "icon": <PersonAddOutlinedIcon/>, } axios.request({ @@ -273,9 +273,9 @@ export default function AccountPage() { data: { "id": user?.id } }) .then(() => { - toast(nextRelation.action, - "confirmation", - nextRelation.icon); + toast({ message: nextRelation.action, + type: "confirmation", + icon: nextRelation.icon }); setRelation(nextRelation.relation); }); }}/> |