diff --git a/src/App.js b/src/App.js index 9e94522..9af4ba1 100644 --- a/src/App.js +++ b/src/App.js @@ -51,10 +51,10 @@ function jsonToArray(json) { function App() { const [data, setData] = useState(undefined); // keeps the state of the json const [dataArray, setDataArray] = useState([]); // put everything into one array. uses more memory, but search is faster and less complex - // eslint-disable-next-line const [loading, setLoading] = useState(true); // Determines whether to show spinner const [searchParams, setSearchParams] = useState({ searchTerm: "", "lang.code": ""}); const [searchResults, setSearchResults] = useState([]); + // eslint-disable-next-line const [cookies, setCookie, removeCookie] = useCookies(["lightMode"]); const [queries, setQueries] = useState({lang: "", subject: ""}); @@ -72,7 +72,7 @@ function App() { useEffect(() => { setQueries(queryString.parse(document.location.search)); if (queries.lang) { - if (queries.lang == "langs" || queries.lang == "subjects") { + if (queries.lang === "langs" || queries.lang === "subjects") { changeParameter("lang.code", "en"); } else { changeParameter("lang.code", queries.lang); @@ -86,11 +86,12 @@ function App() { "https://raw.githubusercontent.com/FreeEbookFoundationBot/free-programming-books-json/main/fpb.json" ); setData(result.data); + // eslint-disable-next-line let { arr, sections } = jsonToArray(result.data); setDataArray(arr); } catch (e) { - // setError("Couldn't get data. Please try again later") setData(fpb); + // eslint-disable-next-line let { arr, sections } = jsonToArray(fpb); setDataArray(arr); } @@ -224,6 +225,7 @@ function App() { changeTheme(willBeDarkMode ? themes.light : themes.dark); return ( Toggle light/dark mode { setCookie("lightMode", willBeDarkMode); diff --git a/src/components/BookList.js b/src/components/BookList.js index 26594ec..57d0d31 100644 --- a/src/components/BookList.js +++ b/src/components/BookList.js @@ -22,7 +22,7 @@ function BookList({ langCode }) { setLoading(false); } fetchData(); - }, []); + }, [langCode]); if (loading) { return

Loading...

; diff --git a/src/components/LangFilters.js b/src/components/LangFilters.js index d8aeb25..730d6f2 100644 --- a/src/components/LangFilters.js +++ b/src/components/LangFilters.js @@ -15,7 +15,7 @@ function LangFilters({ changeParameter, data, langCode }) { useEffect(() => { let queries = queryString.parse(document.location.search); if (queries.lang) { - if (queries.lang == "langs" || queries.lang == "subjects") { + if (queries.lang === "langs" || queries.lang === "subjects") { changeParameter("lang.code", "en"); setSelected("en"); } else { @@ -23,7 +23,7 @@ function LangFilters({ changeParameter, data, langCode }) { setSelected(queries.lang); } } - }, []); + }, [changeParameter]); useEffect( // run whenever data changes @@ -57,7 +57,7 @@ function LangFilters({ changeParameter, data, langCode }) { key={language.code} value={language.code} onChange={handleChange} - checked={language.code == selected} + checked={language.code === selected} /> {language.name} @@ -80,7 +80,7 @@ function LangFilters({ changeParameter, data, langCode }) { className="sect-select" value="" onChange={handleChange} - checked={"" == selected} + checked={"" === selected} /> All Languages diff --git a/src/components/LightSwitch.js b/src/components/LightSwitch.js index 3e5fb42..9426b1c 100644 --- a/src/components/LightSwitch.js +++ b/src/components/LightSwitch.js @@ -1,14 +1,19 @@ -import React, { useState, useEffect } from "react"; +import React, { useState } from "react"; -function LightSwitch(App){ - const [lightMode, setLightMode] = useState(false); - return ( - setLightMode(!lightMode)} style={{width: "100px", height: "100px",display: "block", - marginLeft: "auto", - marginRight: "auto", - }}/> - ) +function LightSwitch() { + const [lightMode, setLightMode] = useState(false); + return ( + Toggle light/dark mode setLightMode(!lightMode)} + style={{ width: "100px", height: "100px", display: "block", marginLeft: "auto", marginRight: "auto" }} + /> + ); } -export default LightSwitch; \ No newline at end of file +export default LightSwitch; diff --git a/src/components/SearchBar.js b/src/components/SearchBar.js index 8f94881..feb67c8 100644 --- a/src/components/SearchBar.js +++ b/src/components/SearchBar.js @@ -1,4 +1,4 @@ -import React, {useEffect, useState} from "react"; +import React, {useEffect} from "react"; const queryString = require("query-string"); function SearchBar(props) { @@ -8,7 +8,7 @@ function SearchBar(props) { document.getElementById("searchBar").value = queries.search; props.changeParameter("searchTerm", queries.search); } - }, []); + }, [props]); const handleChange = (e) => { props.changeParameter("searchTerm", e.target.value); diff --git a/src/components/SectDropdown.js b/src/components/SectDropdown.js index b7027e4..8f828e0 100644 --- a/src/components/SectDropdown.js +++ b/src/components/SectDropdown.js @@ -24,7 +24,7 @@ function SectDropdown({ changeParameter, data, value }) { for (let i = 0; i < document.sections.length; i++) { // console.log("h") // console.log(document.sections[i]); - if (sectArray.indexOf(document.sections[i].section) == -1) { + if (sectArray.indexOf(document.sections[i].section) === -1) { sectArray.push(document.sections[i].section.trim()); } // sectArray.push(document.sections[i].section); @@ -48,7 +48,7 @@ function SectDropdown({ changeParameter, data, value }) { key={section} value={section} onChange={handleChange} - checked={section == selected} + checked={section === selected} /> {section} @@ -67,7 +67,7 @@ function SectDropdown({ changeParameter, data, value }) {

Select Programming Language:

{options} diff --git a/src/darkMode.js b/src/darkMode.js index 196ac33..43c0366 100644 --- a/src/darkMode.js +++ b/src/darkMode.js @@ -1,4 +1,4 @@ -import React, { useState, useEffect, createContext } from "react"; +import React, { useState, createContext } from "react"; //https://levelup.gitconnected.com/dark-mode-in-react-533faaee3c6e