Category "reactjs"

Exported variable 'store' has or is using name '$CombinedState' from external module error Redux toolkit and redux persist

Hi I'm trying to get redux persist working with redux toolkit (also in typescript) I'm getting the following error: Exported variable 'store' has or is using na

Vertical carousel on scroll react

I want to have a section of the website which is fixed while to slide the carousel on scroll (vertically). Once you are at the last slide the scroll will let yo

How do I console.log a changed state in React?

I'm new to React and am working on someone else's code (thrown in the deep end). There is a simple button has a handleClick() handler. I want to increment a sp

React Error: You cannot render a <Router> inside another <Router>. You should never have more than one in your app

[index.js] import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import reportWebVitals from './reportWebV

Centered maps while pinch to zoom like Uber in react native

How to do it like a Uber app? <View> <MapView onRegionChangeComplete={(e) => { setLocalLocation({ latitude:

FormData with NextJS API

Background I am trying to create a simple CRUD application using NextJS along with react-redux, so what it does is that it saves peoples contacts.So when adding

Unable to mock react-redux hooks after migrating to 8

I have been using the following pattern to mock react-redux hooks in tests that use Enzyme shallow rendering: import * as redux from "react-readux"; ... jest.sp

TypeError: undefined is not an object (evaluating 'state.selectedData.push') - Can't add payload to state using Redux Toolkit

I'm having an issue using Redux Toolkit. I want to push an object to my initial state called selectedData which is an array, this gives me the error "TypeError:

react reducer toolkit dispatch not working

I wrote profile page I want to get profile datas from api but my dispatch not working, in getProfileDetails function dispatch not working. import {createSlice}

Draft.js headers do not get rendered properly

I have a next.js environment with tailwind installed and a simple draft.js Text Editor. In my Toolbar Component I toggle inline style and block styles. Everythi

How to style mui-rte CodeBlock

By default the CodeBlock is styled with a white-ish background and black-ish color. This works fine with a "light" palette but is unreadable with a "dark" palet

Framer Motion different Animations for different properties

I am trying to animate an animation in framer motion using Chakra-ui and Gatsby whereby there is rotation and movement and opacity change. At the moment the ani

After test:report:chrome Report generation done, Terminal not closing the instance, it keeps running

I am using protector, selenium for running the UI automation. For chrome driver I am using webdriver-manager for testing the UI Automation. It run successfully,

Typechecking React library with Styled Components

I'm currently working in a design system library to test some things. Basically, the library is a Styled Component wrapper in order to create themes. I built th

Only send values that have changed in formik onSubmit

I have a small table of data that is pre-filled by an api call on page load. Each row in the table has a facility name and an Enabled value which comes from the

Emailjs working in development but not in production

I have a Next js app that have a contact form. I'm using Emailjs to send email to my gmail account. This works perfect in development, but once I deployed it st

In reactjs and nextjs constructor getting Reference Error: localstorage is not defined

i make system jsonwebtoken in reactjs and use nextjs. i find problem when i run the code in browser that is localStorage is not defined. this is my code in fil

Firebase denies access when using env file

I am trying to create a react-app that works with firebase. So, normally the credentials look like this: const firebaseConfig = { apiKey: ..., authDomai

Webpack5 + react-refresh-webpack-plugin does not work

I wanted to setup react with webpack, babel, and typescript myself since I would like to know more and have a consistent boilerplate for development. I have bee

@mantine dropzone React image upload issues while image upload on login form

I tried for getting the image path with Dropzone in this way {...form.getInputProps("tourImages")} but it gives undefined . Also, I tried getting an image inpu