Category "reactjs"

Ensure that there is only one instance of "graphql" in the node_modules directory

While trying to download the schema using npm run schema:download I am receiving the following error. [email protected] schema:download npx apollo service:download

Unable to map nested array data in JavaScript?

Here, I have nested array object categories which have nested array objectproduct. product contains name, price, discount, unitsold properties with images array

Can't insert an array of data into Formik state. One element is set only

I try to add an array of files into "files" property in Formik state, Formik state: initialValues={{ firstName: '', last

Error: Absolute route path "/" nested under path "/app" is not valid

I suddenly get this error and not sure why. I did not change the "react-router-dom": "^6.0.0-beta.4" version. But the "react-dom": "^16.8.4"" vad changed to "re

Failed to minify the code from @mui, while npm run build

I have an app using npx create-react-app name. While trying to build my app using npm run build, it was interrupted with the following error. Failed to minify t

Setting state in React useEffect hook

In my app I fetch data from my API after a button is clicked that changes the state of endpoint. Until the data is fetched I want to display a loading icon. Aft

CRA - window object is undefined - jest/react

I have an issue in my tests that flag up a window variable as undefined. But I don't know where in the setupTests.tsx, I would need to define it. So far the var

Type '{ name: string; }' is not assignable to type 'ReactNode'

I want to render names that are in the State. But I get this error: Type '{ name: string; }' is not assignable to type 'ReactNode'. I understand that ReactNode

How can I call Rtk Query Hook when the condition changes?

I created the endpoint with createApi: export const postsApi = createApi({ reducerPath: 'postsApi', baseQuery: fetchBaseQuery({baseUrl: 'https://jsonplaceho

Change Appbar backgroundColor in MUI

The default Appbar color is set by MUI to the primary color, which is the blue color. If I wanted to change that color directly using sx={{ background: 'white'

How to make interactive active line when clicked with react

I have 3 lists of a clickable links, so when you click one you go to that section and the line too. so this is my code : <div className="description-containe

ReactJS 17.0.2 seems to call function again when putting value into DOM

There is a strange behavior when running ReactJS 17.0.2. I have a function that generates a random number outside of a component. I assign the return value of t

Gatsby not displaying my image retrieved from GraphQL query

So, this is my problem. Im new to Gatsby and im trying to figure out whats the problem, im getting headache cause of this, cuz it seems not syntactically wrong.

Could not identify object - getting error in graphql apollo client

I'm new to graphql I'm building real time chat app. Currently I'm making it offline first. Using react as front-end. I'm currently caching the data on localStor

How to make a Post Request with XML using Axios?

I have a Network error with Axios, using the following code : const getXMLNS = (number) => { return ( '<soapen

mui select wrap text to next line

I'm using Material UI the select with checkbox, I have the following code the select component MenuItem is not wrapping the text with checkbox to next line in t

ReactJS / Axios / Django: Update form with the current image from API

I'm trying to create an update form in React, the update works fine as I have set the default values that coming from (get method) using axios and set them as t

How does chart updating works within the context of react?

I currently have a Radar chart in chart.js using the react integration. I was suprised to note that, when I updated the data, instead of showing a completely ne

How to use class component without extending React.Component

I have been given in built ui kit which has class based component without extending React.Component. Now i need to use those UI components for building UserInte

Can one implement an update system like the CoinMarketCap app in Ionic

I'm currently building an Ionic app which will be getting very frequent updates. If possible, I want to avoid sending users to the app/play store each time I pu