mirror/myspeed
1
0
Fork 0
mirror of https://github.com/gnmyt/myspeed.git synced 2026-02-13 00:59:36 -06:00
Code Issues Packages Projects Releases Wiki Activity

Cleaned up the code in the DialogContext.jsx & fixed the tooltip bug

Browse Source
This commit is contained in:
Mathias Wagner
2022-08-30 18:50:22 +02:00
parent 3369f6cbac
commit b5b7698916
1 changed files with 13 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
client/src/common/contexts/Dialog/DialogContext.jsx
View File

@@ -1,9 +1,9 @@
import React, {useState, createContext} from "react";
import React, {useState, createContext, useEffect} from "react";
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import {faClose} from "@fortawesome/free-solid-svg-icons";
import "./styles.sass";
export const DialogContext = createContext();
export const DialogContext = createContext({});
const Dialog = ({dialog, setDialog}) => {
const [value, setValue] = useState(dialog.value || "");
@@ -23,26 +23,14 @@ const Dialog = ({dialog, setDialog}) => {
setValue(e.target.value);
}
function hideTooltips(state) {
Array.from(document.getElementsByClassName("tooltip")).forEach(element => {
if (state && !element.classList.contains("tooltip-invisible")) {
element.classList.add("tooltip-invisible");
} else if (!state && element.classList.contains("tooltip-invisible")) {
element.classList.remove("tooltip-invisible");
}
});
}
function closeDialog() {
setDialog();
hideTooltips(false);
if (dialog.onClose) dialog.onClose();
}
function submit() {
if (!dialog.description && !value) return;
setDialog();
hideTooltips(false);
if (dialog.onSuccess) dialog.onSuccess(value);
}
@@ -51,8 +39,6 @@ const Dialog = ({dialog, setDialog}) => {
if (dialog.onClear) dialog.onClear();
}
hideTooltips(true);
if (dialog.speedtest) return (
<div className="dialog-area">
<div className="dialog dialog-speedtest">
@@ -93,6 +79,17 @@ const Dialog = ({dialog, setDialog}) => {
export const DialogProvider = (props) => {
const [dialog, setDialog] = useState();
const hideTooltips = (state) => Array.from(document.getElementsByClassName("tooltip")).forEach(element => {
if (state && !element.classList.contains("tooltip-invisible"))
element.classList.add("tooltip-invisible");
if (!state && element.classList.contains("tooltip-invisible"))
element.classList.remove("tooltip-invisible");
});
useEffect(() => {
hideTooltips(dialog);
}, [dialog]);
return (
<DialogContext.Provider value={[setDialog]}>
{dialog ? <Dialog dialog={dialog} setDialog={setDialog}/> : <></>}