I have prepared a simple test project at Github to demonstrate my problem: There is a MUI TextField, a thumbs up or down icon and a text string with word description. The custom App.jsx is shown below: const DICT =…
I know there is only a slight problem in this code. I've been trying to find it but I keep failing, hence I am posting it here. When I manually add data into the useState variables, signin/ signup buttons are…
I have three components: Parent (HomePage.jsx) export default function HomePage() { const [currentSorting, setCurrentSorting] = useState(); return ( <> <IntroSlider /> <main className="main-content"> <MainContentHeader setSorting={setCurrentSorting} /> <ProductSection currentFuncOfSorting={currentSorting} /> </main> </> ); } Child(ProductSection.jsx) export default function ProductSection({ currentFuncOfSorting })…
I created a custom hook in my Nextjs application to send a request using Axios. Here is my useApiRequest file: import { ErrorResponse, SuccessResponse } from "@/types/api"; import axios, { AxiosResponse } from "axios"; import { useState } from "react";…
I am currently facing difficulties in updating my Component Array. My current code is as following: import React from 'react'; import ReactDOM from 'react-dom'; const Item = ({ value }) => { return ( <div className="col"> <div className="card" style={{width: "30rem"}}>…
I have a JS library (Cytoscape) inside my React component. The library need to be handled events with set event handler functions (on diagram/ component initilazation). The problem is that inside these events the state is stale - it only…
I am currently working on building app with react native. when i click button, why doesnt it update my user right away? here is the code: useEffect(() => { const getUser = async (email) => { try { console.log("get user…
I'd like to close the modal on click outside the modal. But with the following code the modal closes also when I click on the modal. It should not close when I click on the modal component. const useOutsideAlerter =…
I have a react and next project which uses multiple pages with a similar structure. In each page we are using custom hooks to load data, so it looks something like: const theme = useTheme() const router = useRouter() const…
I am using react-hook-form with MUI components. To use the Select component, I have wrapped it in the Controller as it can't be registered directly. Everything is working but setValue. Here is the Code: const { register, control, handleSubmit, setValue,…