Category "reactjs"

Problem Upgrading React application - material UI v4 to v5

I have this problem upgrading my react application. Basically, I followed the damn mui-v5 documentation, and I still have some erros in my app.tsx file. import

getTokenIdMetadata function in Moralis is not showing anything on HTML card MUI. How do I fix it?

I am trying to use getTokenIdMetadata from Moralis to get detailed information about an NFT. So far, I am able to get the data as you can see below in the json

IntelliJ reporting typescript error for react-bootstrap-table-next

I'm using react-bootstrap-table-next (aka react-bootstrap-table2). I'm getting a Typescript error in IntelliJ on the validator field in my column definition. I

How to add a google-recaptcha v3 to a functional react component with a form?

I have a ready-made form in React I'm trying to add a captcha to it but it would seem that with the only correct option the captcha reload infinity loops I didt

Storybook 6, use module paths?

Is it possible to configure storybook 6 to use the module paths in my tsconfig.json file to work with sass-loader (or just to replicate the same pattern if that

Puppeteer getting response from url pdf

I'. automating regression tests for a website and one of the tasks is to check the various urls that come in to me. I am using Puppeteer and Chromium for this.

ExportCSV using react-bootstrap-table-2

I'm trying to trigger my exportCSV from a different component outside of the TookkilProvider... is that possible? I did see some reference to this.refs.table.ha

React-select dropdown list getting cut in IE11

React select (https://github.com/JedWatson/react-select) drop down list is not fully shown in IE, works in other browsers. Works on other browsers. I tried set

How to connect to simple tcp socket in React

I am new to React and can't seem to find any example regarding how to create a simple TCP connection to receive data from the other server (NOT via websocket).

How to fetch data only on first click via react-query and then disable refetch on subsequent clicks

I encountered a problem while implementing the form where the data used in select, retrieved from the database via react-query, should only be retrieved once wh

How do I serve a React-built front-end on a FastAPI backend?

I've tried to mount the frontend to / with app.mount, but this invalidates all of my /api routes. I've also tried the following code to mount the folders in /st

How to render jsx calling non component function in React?

I adding return before jsx but it stops iteration function App(){ function recursion(object){ for(let key in object){ if(typeof object[key] === 'ob

useState value not rendering in DOM

I am an absolute beginner with React, I have a component where I need to render the value of a state to the Dom but it doesnt work let me show you my code. Link

Yup (with formik and react) - Can't validate array length

kinda new to Yup and I can't figure out how to validate that an array is not empty. I'm using react + formik + yup + material-ui here is an example I've created

Using React to reset the size of a div with CSS resize enabled

Currently I have a resizable div using resize: both; in its CSS. I'd like to make a function to reset the div back to its initial percentage-based size. I got t

<Link> does not work as expected in NextJS

I am working on creating a Next.js app and part of it requires me to create a dynamic route on click of a card component. However, after wrapping my Cards with

Watchpack Error (watcher): Error: ENOSPC: System limit for number of file watchers reached

This morning when running npm start, I get the error: System limit for number of file watchers reached Because /proc/sys/fs/inotify/max_user_watches has return

Cannot resolve symbol 'Routes'

I am importing Routes the following way import {Routes, Route, BrowserRouter} from 'react-router-dom' My package JSON is "react-router-dom": "^6.0.2", I am us

how to use .env file in a react js with typescript project?

I have a react js project , but with typescript. I understand we can create .env file and have some configuration defined as such, .env file REACT_APP_SOME_CONF

How to show a popup modal on page load in React js functional component

How to show a popup modal on page load in React js functional component.basically when the page loads the popup or modal should be visible automatically without