Category "reactjs"

express-session unable to retrieve session variable

I am using express-session to store my sessions persistently on a MongoDB database. The project worked perfectly in a development environment but for some reaso

TypeError: items.map is not a function

My code problem is that I want to create a token from the backend and add it to my item. Now the page is crashing due to mapping the data. <div className='b

how do I get my add to cart button to work in React (cart is not iterable) issue comes up in console?

When I click my add to cart button on the page it comes up with the error 'cart is not iterable' in console not sure what Im doing wrong as Im not sure I really

Convering a whole number to this format 120m59s

Ive looked online and searched and asked but no one can answer my question I need to format a whole number Eg: 12059 to look like this 120m59s. Ive tried with m

Cannot update a component (`BrowserRouter`) while rendering a different component (`Login`)

I am getting this warning when I have worked on my react project: Warning: Cannot update a component (BrowserRouter) while rendering a different component (Log

My React Component is rendering twice because of Strict Mode

My React Component is rendering twice. So, I decided to do a line by line debug and the problem is here if ( workInProgress.mode & StrictMode) {

How can I filter data in a react redux app gotten from an api

I am fetching data from an API and displaying it in NearestRides component(it gives a nested object). I need to filter the data based on state or city selected

Props not rendering for storybook component

I have a component that will take an array of objects and will render a grid of lists //Awards import React from "react"; import MarkDown from "components/Desi

Why does My chrome Browser show the issue "Audit usage of navigator.userAgent, navigator.appVersion, and navigator.platform"?

My chrome browser suddenly shows an issue like that A page or script is accessing at least one of the navigators.UserAgent, navigator.appVersion, and navigator.

How to target a nested class in a different sheet with JSS?

I'm not actually sure if i am using the proper terminology. Basically i would like to have a file with a component such as: //Foo.tsx const useStyles = createUs

How to use dotenv in react firebase?

I am trying to set some environment variables in react firebase config variables. But it does not work. Now I want to know how to do the work? Mainly I want the

hoist-non-react-statics issue on rollup.js build

i am having issues while trying to build my storybook with rollup.js, in my react components i am using @mui/material and in their installation page its asked t

NodeJS/React install xpi file instead of downloading it

Situation : 1.My nodeJS server serves a file like so : fileRouter.get('/firefox', async (req,res)=>{ const mime = 'application/x-xpinstall'

React material-table

this is my app.js code: import { BasicTable } from './tables/BasicTable'; import './App.css'; function App() { return ( <div className="App">

Highlighting text (user input)

I'm trying to involve coding a simple component to highlight substrings of text provided by a user but I'm getting errors when I'm trying to get the value from

When to query inaccessible elements by setting role vs testId vs DOM container in React Testing Library

I understand that the React Testing Library approach is to query for DOM elements in a way that makes sense from a user's perspective (e.g by role or visual tex

Importing Firebase database object in React results in Uncaught SyntaxError: Cannot use import statement outside a module

I'm working on a project where I need to implement Firestore database in a React app, which I do like this: I have a firebase.js file in the src directory which

How to solve: Type error: 'Draggable' cannot be used as a JSX component ? (react-draggable)

I get this error while building this Next.js React project Type error: 'Draggable' cannot be used as a JSX component. Its instance type 'Draggable' is not a

Threejs: How to make camera view only a part of the model and not all of the model?

I have a humanoid model, I want to view only the top part of the model (The head- shoulders - a part of stomach and arms) How can I do that? Here's my code: App

When I try to push an element to a array but it takes only one rest of the elements are got removed automatically. It happen when use useState hook

const [filter, setFilter] = useState([]); let brandList = []; const handleCheckBox = (e) => { const { value, checked } = e.target; if (checked) {