Compare commits
3 Commits
5dc2b17619
...
2e96583424
| Author | SHA1 | Date | |
|---|---|---|---|
2e96583424
|
|||
|
7abe9dce3d
|
|||
|
90fcaf1f52
|
@@ -337,6 +337,7 @@ class RegisterRequest(BaseModel):
|
|||||||
team_id: int
|
team_id: int
|
||||||
display_name: str
|
display_name: str
|
||||||
username: str
|
username: str
|
||||||
|
gender: str | None
|
||||||
password: str
|
password: str
|
||||||
email: str | None
|
email: str | None
|
||||||
number: str | None
|
number: str | None
|
||||||
@@ -379,6 +380,7 @@ async def register(req: RegisterRequest):
|
|||||||
hashed_password=get_password_hash(req.password),
|
hashed_password=get_password_hash(req.password),
|
||||||
display_name=req.display_name,
|
display_name=req.display_name,
|
||||||
email=req.email if req.email else None,
|
email=req.email if req.email else None,
|
||||||
|
gender=req.gender,
|
||||||
number=req.number,
|
number=req.number,
|
||||||
disabled=False,
|
disabled=False,
|
||||||
teams=[team],
|
teams=[team],
|
||||||
|
|||||||
@@ -7,6 +7,8 @@ import Rankings from "./Form";
|
|||||||
import TeamPanel from "./TeamPanel";
|
import TeamPanel from "./TeamPanel";
|
||||||
import { GraphComponent } from "./Network";
|
import { GraphComponent } from "./Network";
|
||||||
import MVPChart from "./MVPChart";
|
import MVPChart from "./MVPChart";
|
||||||
|
import { SetPassword } from "./SetPassword";
|
||||||
|
import { Register } from "./Register";
|
||||||
|
|
||||||
const Maintenance = () => {
|
const Maintenance = () => {
|
||||||
return (
|
return (
|
||||||
@@ -24,6 +26,7 @@ function App() {
|
|||||||
return (
|
return (
|
||||||
<BrowserRouter>
|
<BrowserRouter>
|
||||||
<Routes>
|
<Routes>
|
||||||
|
<Route path="/register" element={<Register />} />
|
||||||
<Route
|
<Route
|
||||||
path="/*"
|
path="/*"
|
||||||
element={
|
element={
|
||||||
|
|||||||
@@ -300,7 +300,9 @@ function MVPDnD({ user, teams, players }: PlayerInfoProps) {
|
|||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
/>
|
/>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<progress className="progress is-primary" max="100"></progress>
|
<div className="container">
|
||||||
|
<progress className="progress is-primary" max="100"></progress>
|
||||||
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="columns container is-mobile is-1-mobile">
|
<div className="columns container is-mobile is-1-mobile">
|
||||||
<div className="column">
|
<div className="column">
|
||||||
@@ -420,7 +422,9 @@ function ChemistryDnDMobile({ user, teams, players }: PlayerInfoProps) {
|
|||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
/>
|
/>
|
||||||
{loading ? (
|
{loading ? (
|
||||||
<progress className="progress is-primary" max="100"></progress>
|
<div className="container">
|
||||||
|
<progress className="progress is-primary" max="100"></progress>
|
||||||
|
</div>
|
||||||
) : (
|
) : (
|
||||||
<div className="columns container is-multiline is-mobile is-1-mobile">
|
<div className="columns container is-multiline is-mobile is-1-mobile">
|
||||||
<div className="column is-full is-flex is-justify-content-center">
|
<div className="column is-full is-flex is-justify-content-center">
|
||||||
@@ -521,7 +525,9 @@ export default function Rankings() {
|
|||||||
<TypeDnD {...{ user, teams, players }} />
|
<TypeDnD {...{ user, teams, players }} />
|
||||||
</TabController>
|
</TabController>
|
||||||
) : (
|
) : (
|
||||||
<progress className="progress is-primary" max="100"></progress>
|
<div className="container">
|
||||||
|
<progress className="progress is-primary" max="100"></progress>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
236
frontend/src/Register.tsx
Normal file
236
frontend/src/Register.tsx
Normal file
@@ -0,0 +1,236 @@
|
|||||||
|
import { jwtDecode, JwtPayload } from "jwt-decode";
|
||||||
|
import { FormEvent, useEffect, useState } from "react";
|
||||||
|
import { baseUrl, Gender } from "./api";
|
||||||
|
import { useNavigate } from "react-router";
|
||||||
|
|
||||||
|
interface PassToken extends JwtPayload {
|
||||||
|
username: string;
|
||||||
|
name: string;
|
||||||
|
team_id: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const Register = () => {
|
||||||
|
const [name, setName] = useState("");
|
||||||
|
const [username, setUsername] = useState("");
|
||||||
|
const [gender, setGender] = useState<Gender>();
|
||||||
|
const [number, setNumber] = useState("");
|
||||||
|
const [email, setEmail] = useState("");
|
||||||
|
const [teamName, setTeamName] = useState("");
|
||||||
|
const [teamID, setTeamID] = useState<number>();
|
||||||
|
const [password, setPassword] = useState("");
|
||||||
|
const [passwordr, setPasswordr] = useState("");
|
||||||
|
const [passwordHint, setPasswordHint] = useState("");
|
||||||
|
const [token, setToken] = useState("");
|
||||||
|
const [error, setError] = useState("");
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
const navigate = useNavigate();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const params = new URLSearchParams(window.location.search);
|
||||||
|
const token = params.get("token");
|
||||||
|
if (token) {
|
||||||
|
setToken(token);
|
||||||
|
try {
|
||||||
|
const payload = jwtDecode<PassToken>(token);
|
||||||
|
if (payload.sub === "register") {
|
||||||
|
if (payload.team_id) setTeamID(payload.team_id);
|
||||||
|
} else {
|
||||||
|
setError("not a valid token for registration");
|
||||||
|
}
|
||||||
|
if (payload.name) setTeamName(payload.name);
|
||||||
|
} catch (InvalidTokenError) {
|
||||||
|
setError("not a valid token");
|
||||||
|
}
|
||||||
|
} else setError("no token found");
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
function passwordCheck() {
|
||||||
|
if (password === passwordr) {
|
||||||
|
setPasswordHint("");
|
||||||
|
} else setPasswordHint("passwords do not match");
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleSubmit(e: FormEvent) {
|
||||||
|
e.preventDefault();
|
||||||
|
if (password === passwordr) {
|
||||||
|
const req = new Request(`${baseUrl}api/register`, {
|
||||||
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
display_name: name,
|
||||||
|
username: username,
|
||||||
|
email: email,
|
||||||
|
number: number,
|
||||||
|
gender: gender,
|
||||||
|
team_id: teamID,
|
||||||
|
token: token,
|
||||||
|
password: password,
|
||||||
|
}),
|
||||||
|
});
|
||||||
|
let resp: Response;
|
||||||
|
try {
|
||||||
|
resp = await fetch(req);
|
||||||
|
} catch (e) {
|
||||||
|
throw new Error(`request failed: ${e}`);
|
||||||
|
}
|
||||||
|
setLoading(false);
|
||||||
|
|
||||||
|
if (resp.ok) {
|
||||||
|
console.log(resp);
|
||||||
|
navigate("/", {
|
||||||
|
replace: true,
|
||||||
|
state: { username: username, password: password },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!resp.ok) {
|
||||||
|
const { detail } = await resp.json();
|
||||||
|
if (detail) setError(detail);
|
||||||
|
else setError("unauthorized");
|
||||||
|
throw new Error("Unauthorized");
|
||||||
|
}
|
||||||
|
} else setError("the passwords did not match");
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className="section">
|
||||||
|
<div className="container is-max-tablet">
|
||||||
|
<h1 className="title">
|
||||||
|
Register {teamName && `in team "${teamName}"`}
|
||||||
|
</h1>
|
||||||
|
<form onSubmit={handleSubmit}>
|
||||||
|
<div className="field">
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">name</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
required
|
||||||
|
value={name}
|
||||||
|
onChange={(e) => {
|
||||||
|
setName(e.target.value);
|
||||||
|
setError("");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">username</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
required
|
||||||
|
value={username}
|
||||||
|
onChange={(e) => {
|
||||||
|
setUsername(e.target.value);
|
||||||
|
setError("");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">password</label>
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type={"password"}
|
||||||
|
id="password"
|
||||||
|
name="password"
|
||||||
|
placeholder="password"
|
||||||
|
minLength={8}
|
||||||
|
value={password}
|
||||||
|
required
|
||||||
|
onChange={(evt) => {
|
||||||
|
setError("");
|
||||||
|
setPassword(evt.target.value);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">repeat password</label>
|
||||||
|
<input
|
||||||
|
className={"input" + (passwordHint ? " is-danger" : "")}
|
||||||
|
type={"password"}
|
||||||
|
id="password-repeat"
|
||||||
|
name="password-repeat"
|
||||||
|
placeholder="repeat password"
|
||||||
|
minLength={8}
|
||||||
|
value={passwordr}
|
||||||
|
required
|
||||||
|
onChange={(evt) => {
|
||||||
|
setError("");
|
||||||
|
setPasswordr(evt.target.value);
|
||||||
|
passwordCheck();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<p className={"help is-danger"}>{passwordHint}</p>
|
||||||
|
</div>
|
||||||
|
<hr />
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">
|
||||||
|
gender <small>(optional)</small>
|
||||||
|
</label>
|
||||||
|
<div className="control">
|
||||||
|
<div className="select">
|
||||||
|
<select
|
||||||
|
name="gender"
|
||||||
|
value={gender}
|
||||||
|
onChange={(e) => {
|
||||||
|
setGender(e.target.value as Gender);
|
||||||
|
setError("");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<option value={undefined}></option>
|
||||||
|
<option value="fmp">FMP</option>
|
||||||
|
<option value="mmp">MMP</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">
|
||||||
|
number <small>(optional)</small>
|
||||||
|
</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
value={number}
|
||||||
|
onChange={(e) => {
|
||||||
|
setNumber(e.target.value);
|
||||||
|
setError("");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">
|
||||||
|
email <small>(optional)</small>
|
||||||
|
</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="email"
|
||||||
|
value={email}
|
||||||
|
onChange={(e) => {
|
||||||
|
setEmail(e.target.value);
|
||||||
|
setError("");
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<p className={"help" + (error ? " is-danger" : " is-success")}>
|
||||||
|
{error}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field is-grouped is-grouped-centered">
|
||||||
|
<button className="button is-light is-success">register</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
};
|
||||||
@@ -77,160 +77,170 @@ const TeamPanel = () => {
|
|||||||
<h2 className="subtitle">
|
<h2 className="subtitle">
|
||||||
{activeTeam.location}, {activeTeam.country}
|
{activeTeam.location}, {activeTeam.country}
|
||||||
</h2>
|
</h2>
|
||||||
<div className="box">
|
<div className="panel">
|
||||||
<h2 className="title is-4">Players</h2>
|
<h2 className="panel-heading is-4">Players</h2>
|
||||||
{players ? (
|
<div className="panel-block">
|
||||||
<div className="buttons">
|
{players ? (
|
||||||
{players.map((p) => (
|
<div className="buttons">
|
||||||
|
{players.map((p) => (
|
||||||
|
<button
|
||||||
|
className={
|
||||||
|
"button is-primary is-light " +
|
||||||
|
p.gender +
|
||||||
|
(p.id === player.id ? " is-focused is-active" : "")
|
||||||
|
}
|
||||||
|
key={p.id}
|
||||||
|
onClick={() => {
|
||||||
|
setPlayer(p);
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{p.display_name}
|
||||||
|
</button>
|
||||||
|
))}
|
||||||
|
<button
|
||||||
|
className="button is-success is-light new-player"
|
||||||
|
key="add-player"
|
||||||
|
onClick={() => {
|
||||||
|
setPlayer(newPlayerTemplate);
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
+
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<span className="loader" />
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="panel-block">
|
||||||
|
<form onSubmit={handleSubmit}>
|
||||||
|
<div className="field is-grouped is-grouped-multiline">
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">name</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
required
|
||||||
|
value={player.display_name}
|
||||||
|
onChange={(e) => {
|
||||||
|
setPlayer({
|
||||||
|
...player,
|
||||||
|
...(player.id === 0 && {
|
||||||
|
username: e.target.value
|
||||||
|
.toLowerCase()
|
||||||
|
.replace(/\W/g, ""),
|
||||||
|
}),
|
||||||
|
display_name: e.target.value,
|
||||||
|
});
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">username</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
required
|
||||||
|
disabled={player.id !== 0}
|
||||||
|
value={player.username}
|
||||||
|
onChange={(e) => {
|
||||||
|
setPlayer({ ...player, username: e.target.value });
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">gender</label>
|
||||||
|
<div className="control">
|
||||||
|
<div className="select">
|
||||||
|
<select
|
||||||
|
name="gender"
|
||||||
|
value={player.gender}
|
||||||
|
onChange={(e) => {
|
||||||
|
setPlayer({
|
||||||
|
...player,
|
||||||
|
gender: e.target.value as Gender,
|
||||||
|
});
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<option value={undefined}></option>
|
||||||
|
<option value="fmp">FMP</option>
|
||||||
|
<option value="mmp">MMP</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">
|
||||||
|
number <small>(optional)</small>
|
||||||
|
</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="text"
|
||||||
|
value={player.number || ""}
|
||||||
|
onChange={(e) => {
|
||||||
|
setPlayer({ ...player, number: e.target.value });
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field">
|
||||||
|
<label className="label">
|
||||||
|
email <small>(optional)</small>
|
||||||
|
</label>
|
||||||
|
<div className="control">
|
||||||
|
<input
|
||||||
|
className="input"
|
||||||
|
type="email"
|
||||||
|
value={player.email || ""}
|
||||||
|
onChange={(e) => {
|
||||||
|
setPlayer({ ...player, email: e.target.value });
|
||||||
|
setError({ ok: true, message: "" });
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{error?.message && (
|
||||||
|
<p
|
||||||
|
className={
|
||||||
|
"help" + (error.ok ? " is-success" : " is-danger")
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{error.message}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="field is-grouped is-grouped-centered">
|
||||||
<button
|
<button
|
||||||
className={
|
className={
|
||||||
"button is-primary is-light " +
|
"button is-light" +
|
||||||
p.gender +
|
(player.id === 0 ? " is-success" : " is-link")
|
||||||
(p.id === player.id ? " is-focused is-active" : "")
|
|
||||||
}
|
}
|
||||||
key={p.id}
|
|
||||||
onClick={() => {
|
|
||||||
setPlayer(p);
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
{p.display_name}
|
{player.id === 0 ? "add player" : "modify player"}
|
||||||
</button>
|
</button>
|
||||||
))}
|
{player.id !== 0 && (
|
||||||
<button
|
<button
|
||||||
className="button is-success is-light new-player"
|
className="button is-danger is-light"
|
||||||
key="add-player"
|
onClick={handleDisable}
|
||||||
onClick={() => {
|
>
|
||||||
setPlayer(newPlayerTemplate);
|
remove player
|
||||||
setError({ ok: true, message: "" });
|
</button>
|
||||||
}}
|
)}
|
||||||
>
|
|
||||||
+
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
) : (
|
|
||||||
<span className="loader" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<form className="container block" onSubmit={handleSubmit}>
|
|
||||||
<div className="field">
|
|
||||||
<label className="label">name</label>
|
|
||||||
<div className="control">
|
|
||||||
<input
|
|
||||||
className="input"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
value={player.display_name}
|
|
||||||
onChange={(e) => {
|
|
||||||
setPlayer({
|
|
||||||
...player,
|
|
||||||
...(player.id === 0 && {
|
|
||||||
username: e.target.value
|
|
||||||
.toLowerCase()
|
|
||||||
.replace(/\W/g, ""),
|
|
||||||
}),
|
|
||||||
display_name: e.target.value,
|
|
||||||
});
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="field">
|
|
||||||
<label className="label">username</label>
|
|
||||||
<div className="control">
|
|
||||||
<input
|
|
||||||
className="input"
|
|
||||||
type="text"
|
|
||||||
required
|
|
||||||
disabled={player.id !== 0}
|
|
||||||
value={player.username}
|
|
||||||
onChange={(e) => {
|
|
||||||
setPlayer({ ...player, username: e.target.value });
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="field">
|
|
||||||
<label className="label">gender</label>
|
|
||||||
<div className="control">
|
|
||||||
<div className="select">
|
|
||||||
<select
|
|
||||||
name="gender"
|
|
||||||
value={player.gender}
|
|
||||||
onChange={(e) => {
|
|
||||||
setPlayer({
|
|
||||||
...player,
|
|
||||||
gender: e.target.value as Gender,
|
|
||||||
});
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<option value={undefined}></option>
|
|
||||||
<option value="fmp">FMP</option>
|
|
||||||
<option value="mmp">MMP</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div className="field">
|
</div>
|
||||||
<label className="label">number (optional)</label>
|
|
||||||
<div className="control">
|
|
||||||
<input
|
|
||||||
className="input"
|
|
||||||
type="text"
|
|
||||||
value={player.number || ""}
|
|
||||||
onChange={(e) => {
|
|
||||||
setPlayer({ ...player, number: e.target.value });
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="field">
|
|
||||||
<label className="label">email (optional)</label>
|
|
||||||
<div className="control">
|
|
||||||
<input
|
|
||||||
className="input"
|
|
||||||
type="email"
|
|
||||||
value={player.email || ""}
|
|
||||||
onChange={(e) => {
|
|
||||||
setPlayer({ ...player, email: e.target.value });
|
|
||||||
setError({ ok: true, message: "" });
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
{error?.message && (
|
|
||||||
<p
|
|
||||||
className={
|
|
||||||
"help" + (error.ok ? " is-success" : " is-danger")
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{error.message}
|
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="field is-grouped">
|
|
||||||
<button
|
|
||||||
className={
|
|
||||||
"button is-light" +
|
|
||||||
(player.id === 0 ? " is-success" : " is-link")
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{player.id === 0 ? "add player" : "modify player"}
|
|
||||||
</button>
|
|
||||||
{player.id !== 0 && (
|
|
||||||
<button
|
|
||||||
className="button is-danger is-light"
|
|
||||||
onClick={handleDisable}
|
|
||||||
>
|
|
||||||
remove player
|
|
||||||
</button>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section className="section">
|
<section className="section">
|
||||||
|
|||||||
Reference in New Issue
Block a user