Category "reactjs"

React, Graphql schema type declaration

I'm using graphql in React and Apollo:generate to create types from the graphql schema. I'm also using react-apollo-hooks useQuery to output the data. Everyth

How can I edit this TextField?

I have an Material UI text field which is populated by a nested JSON object pulled from an API. Data can be displayed in either a TextField, a Date Picker, or a

Google sign in with Firebase 09 : signInWithPopup and signInWithRedirect return an undefined error

Here is the authcontext import and code import {signInWithPopup, GoogleAuthProvider, createUserWithEmailAndPassword, getAuth, onAuthStateChanged, signInWithEmai

Rollup doesn't bundle all the files exported in my input src

I have a problem. I'm currently making a component library for react, it works perfectly in storybook. But when I do a npm rollup, or install my package from np

MongoDB Atlas very slow connection on hot reload

I have been working on a React application that would connect to MongoDB Atlas with Mongoose. Using nodemon and webpack for hot reloading it would reconnect to

Chakra-UI Text component noOfLines doesn't display right in Safari

I havea a Chakra-UI Text component in a Next.js TypeScript web app. The noOfLines doesn't display right in Safari, but correct in Chrome. Any suggestions?

How to make a button inside of the anchor tag clickable in React?

I know that some relevant questions exist but none of them really has an answer more than saying that it is not possible. What I would like to achieve is having

How to pass parameters in Next.js without SSR?

I try pass params as docs says here: https://nextjs.org/docs/routing/dynamic-routes but the received params are not string??!! How could it be string array? I u

Workaround to add className to Fragment in React

I am trying to create a stateless component in React with the sole purpose of acting as a reusable wrapper. I am also using CSS Modules because I want to have f

React router with basename and webpack initial url

Hello i am stuck with this one and couldnt figure it out. So i have React router v6 with basename - "/ui/" , and i want that when i open localhost:8080 that it

Preserve type argument in Redux connected component

I have a simple component that takes a type argument on props. When used, it infers the prop type and contextually types a callback param. However, when I wrap

How to add multiple classNames to nextjs elements

I have an unordered list element that looks like this: <ul className={styles["projects-pd-subdetails-list"]}> {detail.subdetails.map((sub) =&

Need help on a react.js error that I keep on getting

Every time I try running npm start on a new project I keep on getting this error. Does anyone know or have any idea how to fix this?? There might be a problem

Mocking react-router-dom hooks using jest is not working

I'm using Enzyme's shallow method to test a component which uses the useParams hook to get an ID from the URL params. I'm trying to mock the useParams hook so

How to add scroll into react-bootstrap Modal.Body

I'm using react-bootstrap modal. How can I make only body to scroll and not all the page? <Modal.Dialog> <Modal.Header> <Modal.Titl

React state not updating after a post request?

I'm trying to send a post request to my backend with axios, and my backend gets the values with no problem, but I want to set a state of (sent) to true when the

How to make MUI's Autocomplete display the label from the matching value in props.options?

I have a multilingual website where there are certain Autocompletes whose options array need to have its items labels translated, which is done very easily. How

Material UI DatePicker set to Required

i am using the Material UI DatePicker in my react app and need to set the date to be required? Do I need to create a custom validator checking value on submit

What does it change to declare a constant above or bellow a React functional component?

My question is what does it change to declare a constant above or bellow a React functional component (or a class component also) ? for example what is the diff

React app stuck on "Starting the development server"

I have a react app created by create-react-app. After running npm start (the start script is present in package.json as "start": "react-scripts start") the cons