feat: querySelector -> useRef
This commit is contained in:
parent
630986d49c
commit
9afa4a88a8
@ -1,4 +1,4 @@
|
||||
import { createRef, useEffect, useState } from "react";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { ReactSortable, ReactSortableProps } from "react-sortablejs";
|
||||
import { apiAuth, User } from "./api";
|
||||
import { useSession } from "./Session";
|
||||
@ -39,10 +39,10 @@ export function Chemistry({ user, players }: PlayerInfoProps) {
|
||||
}, [players]);
|
||||
|
||||
const [dialog, setDialog] = useState("dialog");
|
||||
const dialogRef = useRef<HTMLDialogElement>(null);
|
||||
|
||||
async function handleSubmit() {
|
||||
const dialog = document.querySelector("dialog[id='ChemistryDialog']");
|
||||
(dialog as HTMLDialogElement).showModal();
|
||||
if (dialogRef.current) dialogRef.current.showModal();
|
||||
setDialog("sending...");
|
||||
let left = playersLeft.map(({ id }) => id);
|
||||
let middle = playersMiddle.map(({ id }) => id);
|
||||
@ -99,6 +99,7 @@ export function Chemistry({ user, players }: PlayerInfoProps) {
|
||||
💾 <span className="submit_text">submit</span>
|
||||
</button>
|
||||
<dialog
|
||||
ref={dialogRef}
|
||||
id="ChemistryDialog"
|
||||
onClick={(event) => {
|
||||
event.currentTarget.close();
|
||||
@ -114,15 +115,15 @@ export function MVP({ user, players }: PlayerInfoProps) {
|
||||
const [availablePlayers, setAvailablePlayers] = useState<User[]>(players);
|
||||
const [rankedPlayers, setRankedPlayers] = useState<User[]>([]);
|
||||
|
||||
const [dialog, setDialog] = useState("dialog");
|
||||
|
||||
useEffect(() => {
|
||||
setAvailablePlayers(players);
|
||||
}, [players]);
|
||||
|
||||
const [dialog, setDialog] = useState("dialog");
|
||||
const dialogRef = useRef<HTMLDialogElement>(null);
|
||||
|
||||
async function handleSubmit() {
|
||||
const dialog = document.querySelector("dialog[id='MVPDialog']");
|
||||
(dialog as HTMLDialogElement).showModal();
|
||||
if (dialogRef.current) dialogRef.current.showModal();
|
||||
setDialog("sending...");
|
||||
let mvps = rankedPlayers.map(({ id }) => id);
|
||||
const data = { user: user.id, mvps: mvps };
|
||||
@ -177,6 +178,7 @@ export function MVP({ user, players }: PlayerInfoProps) {
|
||||
💾 <span className="submit_text">submit</span>
|
||||
</button>
|
||||
<dialog
|
||||
ref={dialogRef}
|
||||
id="MVPDialog"
|
||||
onClick={(event) => {
|
||||
event.currentTarget.close();
|
||||
@ -205,6 +207,7 @@ export default function Rankings() {
|
||||
useEffect(() => {
|
||||
loadPlayers();
|
||||
}, []);
|
||||
|
||||
const tabs = [
|
||||
{ id: "Chemistry", label: "🧪 Chemistry" },
|
||||
{ id: "MVP", label: "🏆 MVP" },
|
||||
|
Loading…
x
Reference in New Issue
Block a user