diff --git a/src/components/shared/Exercises/UnitCircleInput.tsx b/src/components/shared/Exercises/UnitCircleInput.tsx index 3521d0f..320a657 100644 --- a/src/components/shared/Exercises/UnitCircleInput.tsx +++ b/src/components/shared/Exercises/UnitCircleInput.tsx @@ -1,4 +1,4 @@ -import { useState, useEffect } from 'react'; +import { useState } from 'react'; import '../../../styles/Exercises/UnitCircleInput.scss'; interface UnitCircleInputProps { @@ -15,9 +15,6 @@ interface CircleQuestion { id: number; //This sucks lol } -// Put this inside the function, push on each initial render, only update on render? -// let focusedList: boolean[] = [true, false, false]; - function UnitCircleInput({ nextExercise, answers, @@ -28,65 +25,10 @@ function UnitCircleInput({ const handleChange = (event: { target: { value: string } }) => { setText(event.target.value, id); }; - const [isInputFocused, setIsInputFocused] = useState(false); - - useEffect(() => { - const input = document.getElementById(`unitcircle-check-box-${label}`); - - // if (id === 0) { - // focusedList.push(true); - // } else { - // focusedList.push(false); - // } - - const focusListener = () => { - setIsInputFocused(true); - }; - - const blurListener = () => { - setIsInputFocused(false); - }; - - if (input) { - input.addEventListener('focus', focusListener); - input.addEventListener('blur', blurListener); - } - - // Clean up event listeners when component unmounts - return () => { - if (input) { - input.removeEventListener('focus', focusListener); - input.removeEventListener('blur', blurListener); - } - }; - }, []); - - // useEffect(() => { - // for (let i = 0; i < focusedList.length; i++) { - // if (inputText[id]) { - // focusedList[i] = true; - // } - // } - // for (let i = 1; i < focusedList.length; i++) { - // if (focusedList[i] === false && !inputText[id - 1]) { - // setIsInputFocused(true); - // break; - // } - // } - // }); - - // console.log(focusedList[id]); - /* lines 25-35, try to get component to look like this */ return (
-

+

{label} = {direction}{' '}

);