Category "reactjs"

How to make a Chakra ui react theme drawer have a closeButton icon that aligns to the beginning of the drawer

I'm following this Chakra Doc on how to create a drawer slideout menu: https://chakra-ui.com/docs/overlay/drawer using the following component: import React fro

How to override bootstrap 5 modal scss property in react

Here I have use case to have a modal on the page header. since the page header has position:fixed bootstrap modal backdrop is overlayed at the top so unable to

Why render error in react v18 occures although I do not use legacy code?

Hy, guys! I have a render error in my react v18 code like this: Warning: react-dom.development.js:86 Warning: ReactDOM.render is no longer supported in React 1

How to create a type for file type `Record<string, File>` in zod

I use input type="file" and instead of saving data in FileData I use just plain object and created a type for it: Record<string, File>. It works well, but

Why am i getting " Expected an assignment or function call and instead saw an expression" error here?

Im getting " Expected an assignment or function call and instead saw an expression" error at the seconduse effect, it finds the socket port correctly, am i perf

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

I have a little bug in my console. Every time I try to run my app it breaks. FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory 1

You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0). We no longer support global installation of Create React App

C:\Users\lg\Desktop> npm uninstall -g create-react-app up to date, audited 1 package in 216ms found 0 vulnerabilities C:\Users\lg\Desktop>npx clear-npx

You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0). We no longer support global installation of Create React App

C:\Users\lg\Desktop> npm uninstall -g create-react-app up to date, audited 1 package in 216ms found 0 vulnerabilities C:\Users\lg\Desktop>npx clear-npx

How can i style conditionally one row in material-table

I would like to style on row based on a certain props of one row, here is the code : <MaterialTable className="ciao" title="One Detail Panel

com.facebook.react.commot.JavascriptException: Invalid or unexpected token

I'm trying to debug my android app with react native v0.66.1 and react native tools v1.8.1 in vsCode. But after running the app and attach to packager, or launc

In React, rendering of array components does not work

After generating the code with create-react-app, we changed App.js to the following code. After typing in an item input tag, the other elements of the item disa

I am trying to create a react app with typescript but I keep getting failed to compile on start

I am trying to create a react app with --template typescript and I keep getting this error: ERROR in Plugin "react" was conflicted between "package.json »

How to run async call on a reducer?

import { createSlice, PayloadAction } from "@reduxjs/toolkit" import { Dispatch } from 'redux'; import axios from "axios" const API_URL = process.env.REACT_APP_

Individual component exports with Rollup instead of one massive index.js file?

I’m working on a proprietary component library built with React and using Rollup to bundle everything. Currently, it’s bundling everything into thes

How can I link certain actions between 2 Redux stores?

I've got a situation whereby I wish to "link" a portion 2 Redux stores together (I know this is unusual), but I can't work out how to filter the actions appropr

Change the :active background-colour of the React-Bootstrap tabs

I am new to bootstrap but I am a bit fluent in React. I just want to ask how to change the :active background colour of the react-bootstrap tabs. Here is the li

How to display Google Locations reviews on my website with google api?

I know this question is common, however, I couldn't find any straight answers. All the answers have mentioned what is required to achieve this but no end soluti

Display loader before a react-apexchart is displayed

I want to display a loader till my chart is displayed.I have implemented the following code but it doesn't work.The loader should display as soon as "compare" b

Convert React/javascript string array of objects to array of objects

This seems like a trivial issues but I can't get it working properly. I'm fairly new to JS/React so that is working against me also. This is the response I get

TypeError: Cannot read properties of undefined (reading 'EmailAuthProvider')

Attempting to implement FirebaseUI authorization in a Next.js application following this example https://github.com/easywebsify/next-login-firebase. Getting the