Questions tagged [redux]

Redux is a pattern and library for managing JavaScript application state, using events called "actions". It serves as a centralized store for state that is needed across your entire application, with rules ensuring that the state can only be updated in a predictable fashion. Redux make it easier to understand when, where, why, and how the state in your application is being updated, and how your application logic will behave when those changes occur.

Filter by
Sorted by
Tagged with
-1 votes
1 answer
28 views

using reduxjs toolkit to generate cakeSlice - giving type Error - cannot readt properties of undefine (reading 'ordered')

i am using reduxjs toolkit to learn - action auto generation and reducer generation topics using toolkit. below is my code: cakeSlice.js const createSlice = require('@reduxjs/toolkit').createSlice; ...
Sandeep Prajapati's user avatar
-1 votes
1 answer
41 views

Unable to pull data from Redux store

I store the data in the Redux store. I can see it using Redux-DevTools that initially it is null, but when I refresh page the data is in the store. However when I tried to pull that data in one of my ...
Rohit madhesia's user avatar
1 vote
1 answer
35 views

How to update expo app block after getting data from database?

I'm trying to connect database with my expo app. I used react redux to get data from database and when data is loaded i need to update my furniture block with data i got. But when i'm getting data ...
ParoVchiK's user avatar
-1 votes
0 answers
16 views

State not synchronously updated with React custom hook and Redux toolkit/persist [closed]

I'm making a blog website, using React/Redux & NodeJS. I was implementing server side error handling for sign-in/up form to display error messages for users. I realize if there was a previous ...
devsee's user avatar
  • 1
-1 votes
0 answers
39 views

Why does the "reactionAdded" function not work? [closed]

this is my reactionButtons component: import { useDispatch } from "react-redux"; import { reactionAdded } from "../reducers/blogSlice"; interface Reactions { [key: string]: ...
Samir's user avatar
  • 1
-2 votes
0 answers
20 views

data initialization in redux toolkit + nextjs 14 [closed]

well. this might be a silly question but, im using redux-toolkit with nextjs version 14. this is my authSlice.tsx import { PayloadAction, createSlice } from "@reduxjs/toolkit" const ...
Mohamadreza Kazemian's user avatar
0 votes
1 answer
37 views

dispatch an action only on react component unmount

I am using multiple tabs in react-js and each tab content is a component like below profile component that contains multiple input controls. I want to dispatch an updateUser action when tab will be ...
radhey_mishra's user avatar
-1 votes
1 answer
60 views

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'user')

While registering a user I am getting this error. Apparently I must be forwarded to the login page after registering the user but I am getting this error. Looks like the problem is with fetching the ...
H_R_S's user avatar
  • 11
-1 votes
0 answers
33 views

In React using Redux, how do I force a re-render when an attribute of an object stored in state changes? [closed]

I'm using React 18. I manage my state through Redux and have defined this reducer ... saveSender: (state, action: PayloadAction<Contact>) => { state.orderItem.sender = action.payload }, ...
Dave's user avatar
  • 15.2k
-1 votes
0 answers
12 views

Generic function type narrowing in Redux reducer [closed]

I've been recently struggling with typing a generic Redux reducer, so it can handle multiple variations of state at once. So far I was able to make types work for almost whole reducer, but there is ...
Ashylen's user avatar
  • 428
-2 votes
1 answer
85 views

Limit the number of onChange triggers

I have this component with a textarea where I set the value to {store.some_property} from the Redux store. My intention is to update the store by dispatching an action using the onChange event on the ...
Vahid's user avatar
  • 272
-1 votes
1 answer
35 views

Not able to access auth state in Redux

I am not getting why I am getting undefined error, can someone help me to fix why I am not able to access auth state? src/queries/authSlice.jsx : import { createSlice } from "@reduxjs/toolkit&...
Sanad Qazi's user avatar
3 votes
1 answer
60 views

Using useSelector value in function property

I have a React application that relies on the value produced by a useSelector listener within a function that I pass as a property to a child component: import React from "react"; import { ...
Ryan M's user avatar
  • 153
0 votes
0 answers
43 views

React not sending api requests for fetching data(axios get)

ProductDetail page const ProductDetail = () => { const { id } = useParams(); const dispatch = useDispatch(); const history = useNavigate(); const productDetails = useSelector((state) => ...
nafhaf's user avatar
  • 19
1 vote
1 answer
52 views

React Getting error props.auth.data.map not a function after use modal to create a record. Record is added but I need to reload the page to see result

The parent component is a table that shows all the records I have for members in a table. I fetch that data from an API in django. I have a modal that allows me to create a new member. I am able to ...
Quijote60's user avatar
1 vote
2 answers
32 views

What is the use of extra and extraoptions in Redux-Toolkit Query? How could we populate them when using the query & queryFn?

I am just curious to know the way to populate extra and extraOptions, and from where the arguments must be passed in order so that they can get populated and can be used then in creating some ...
shawnMarkus's user avatar
1 vote
1 answer
35 views

Redux useSelector hook always return an empty array

I have a react component like this, where I have a websocket set up, and on websocket events I am trying to update state inside of Redux const Body = () => { // Hook for Redux dispatch ...
RedRum69's user avatar
0 votes
0 answers
41 views

Too much recursion in React Redux [closed]

I've been currently trying to implement an onChange function in a textarea which content will be stored temporarily in local storage only to be then used to create a new element and delete the ...
Batiste HERBEZ's user avatar
-1 votes
0 answers
16 views

How to move general Axios dispatch to NextJs 13?

I'm moving project to App Router. I used to have 2 axios dispatches inside of useEffect in _app.js, so that data will be loaded once regardless of the page and then shared among project. How can I ...
Alyona's user avatar
  • 1,738
0 votes
1 answer
50 views

React Redux: Inconsistent Value of Variable Inside and Outside Function in Custom Hook

I am encountering an issue in a custom React hook that uses Redux. The problem is related to the inconsistency of a variable's value inside and outside a function within the same hook. Here's the ...
Amine Ladrani's user avatar
-1 votes
0 answers
38 views

React Redux state management

I'm doing a project in which I'm building a budget allocation app for a company. The application is built with React-Redux and has many components. They want me to create a dropdown with a selection ...
Gianni's user avatar
  • 1
1 vote
2 answers
49 views

Why does the query error appear in the console even after it has been handled? RTK Query + React

This is my error handler : export const onAuthQueryStartedErrorToast = async ( _: any, { queryFulfilled }: any, ) => { try { await queryFulfilled; } catch (error) { const isError = ...
Roman 's user avatar
  • 75
-1 votes
0 answers
28 views

How to implement a save-on-unfocus/save-on-click-outside-component functionality in react-native?

I have a container component that fetches data from a database using RTK Query and then renders a FlatList using the data. The data (referred to as "items") returned has the following ...
VaniCodes's user avatar
1 vote
1 answer
36 views

RTK Query data provided by useMutation() undefined

I can't seem to find an answer to this specific case and I am somewhat new to whole JS world, so would appreciate explanation of following: I am using Redux-Toolkit (RTK) and RTK Query, all works ...
DjoMan's user avatar
  • 15
-1 votes
1 answer
41 views

Redux-toolkit with Map/Set [closed]

how to us e Map/Set with redux-toolkit ? i try to install immer with this code but doesnot work import { configureStore } from '@reduxjs/toolkit'; import { enableMapSet } from 'immer'; // Import ...
khaled's user avatar
  • 15
1 vote
0 answers
45 views

Redux state change does not trigger React component rerenders

this is an adapter called pairings import { createEntityAdapter } from '@reduxjs/toolkit'; // For now will use row ID as the Pairing_ID since it does not exist export const pairingsAdapter = ...
RedRum69's user avatar
-1 votes
0 answers
25 views

Use external selector function doesn't work during test with redux-mock-store

I have to test a simply component: const Summary = () => { const summary = useSelector(summaryReducer); return ( <div className="summary-container" data-testid="summary&...
Shanille's user avatar
-1 votes
0 answers
27 views

problem with getting a user in google oauth2 [closed]

I'm developing authorization using google oAuth2 in node.js and react. The plan was as follows: receive a link to select a google account, receive data from the account (directly the user), generate ...
Vika Tiurne's user avatar
0 votes
1 answer
37 views

Learning python flask for the first time and I'm having a trouble connecting my React frontend with Flask Api

I'm currently learning flask for the first time by making a simple API with it. I wrote my frontend with React JS and I made a simple visitor counter for my portfolio website. The error that I'm ...
Jeffrey's user avatar
  • 57
-1 votes
0 answers
68 views

TS2322: Type {} is not assignable to type never

Not sure how to resolve this. Dependencies: "@types/react": "^16.9.46" "@types/react-redux": "^7.1.9" "@types/react-dom": "^16.9.8" "...
PositiveGuy's user avatar
  • 18.2k
1 vote
0 answers
27 views

Issue with Sending Large(<1 MB) payload in POST request in Browser

Backend Architecture: The backend system is designed to format requests as XML data and then encrypt them using the AES-GCM algorithm before sending to the server. The file is sent as a buffer text ...
Mohamed Rifkan's user avatar
-1 votes
0 answers
60 views

Removing an object from React Redux Reducer does not update state

I am using React, Redux and Redux Toolkit I am defining something called pairingsForEdit This is the Adapter for it made with createEntityAdapter from Redux Toolkit import { createEntityAdapter } from ...
RedRum69's user avatar
0 votes
0 answers
18 views

Redux DevTools shows unexpected repetition of ALL_PRODUCT_REQUEST after API call

I'm facing an issue with my Redux setup where, after dispatching ALL_PRODUCT_REQUEST in my getProduct action and successfully fetching data from an API, the same action (ALL_PRODUCT_REQUEST) seems to ...
VMS's user avatar
  • 21
-1 votes
0 answers
29 views

Action order with redux-toolkit, thunks and listener middleware (with firebase auth)

Problem Presently, when logging in with firebase authentication (for web), the action setStateByAction is dispatched before setName. I would like the action setStateByAction to be performed after ...
saner's user avatar
  • 406
0 votes
1 answer
49 views

react-bootstrap modal disappears without setting showModal to false

I have a login Modal, from react-bootstrap, that when I fill the username and password and click on login, it disappears without waiting to showLoginModal to be set to false. This is the component: ...
Vahid's user avatar
  • 272
0 votes
1 answer
32 views

Using redux as a client side caching, but is there a scenario where too much caching backfires on performance?

I love how redux can be used for caching some data such that it does not need to be fetched again from the backend. But as I was doing it, I was wondering whether if there are any cons of doing it? ...
Saadman Islam Khan's user avatar
1 vote
1 answer
97 views

getting the changed value in state

I have a project that sends values to a server when the state changes via websocket and i'm using redux-toolkit and I have a state like this const initialState = { exposure: false, whiteBalance: ...
alexander fijjek's user avatar
0 votes
0 answers
34 views

Not getting data using useEffect in react but get endpoint is working as tested using postman

I am trying to get data from Mongo DB using fetch GET request. I am using useEffect to get data as shown below. import React, { useEffect } from "react"; import { useDispatch, useSelector } ...
Vishal's user avatar
  • 7
0 votes
0 answers
34 views

I am getting an error related to redux-persist: Could not resolve "react"

I am using the redux-persist and I was just adding it to the 'main.js' file but I keep getting this error: Could not resolve "react" ../node_modules/redux-persist/es/integration/react....
yami S's user avatar
  • 21
0 votes
1 answer
34 views

Optimal Approach for Accessing Redux State in React App with Multiple Instances of Child Components

I'm working on a React app utilizing Redux as the state management system. In the app, I have a parent component that includes multiple instances of the same child component. Now, I'm faced with a ...
Chathura Buddhika's user avatar
0 votes
1 answer
27 views

What is the correct way to type an rtk query BaseQueryFn with custom DefinitionExtraOptions?

I want to use custom base query, and supply it with extra options. Here's a toy example: import { BaseQueryFn, createApi } from '@reduxjs/toolkit/query/react'; const baseQueryTest: BaseQueryFn< ...
Max Yankov's user avatar
  • 12.7k
0 votes
0 answers
47 views

How access redux state outside react component?

I am starting learning redux and face some issue, I want to configure axios interceptor for set jwt token every request but token is store in authSlice , I was read a article : https://daveceddia.com/...
Quốc Việt's user avatar
0 votes
0 answers
28 views

Pusher channel in React Native + Redux does not use updated state

I'm using pusher-websocket-react-native to create a real-time chat for a mobile application on Expo. I noticed that whenever I subscribe to a presence channel, it maintains its own state which means ...
Afeef's user avatar
  • 1
1 vote
1 answer
22 views

Use cache from other query in transformResponse

I've been searching around for an answer to this, but I've not had any luck. I'm new to RTK Query, but so far so good. I have two queries where I want to transform the response of the second query, ...
Metaman's user avatar
  • 421
1 vote
1 answer
53 views

redux/createSelector keeps re-rendering in react-native app

I'm building a social media app in react native. I'm using react-redux with redux-toolkit and flashlist, along with other libraries. My redux state (simplified) looks like this: (postState is the name ...
Sam Leurs's user avatar
  • 1,704
1 vote
1 answer
52 views

Items not being displayed in cart

I'm encountering an issue with my React Redux Cart component where although items are being added to the cart state via the addItem action, they aren't rendering on the Cart page. Problem: When I add ...
Dave's user avatar
  • 21
0 votes
0 answers
32 views

I'm trying to setup a Redux application using Docker but Vite is giving me Error: spawn xdg-open

I am working on containerizing a barebones redux application using Docker but when I docker compose up npm start works but it gives me an error related to xdg-open. I'm confused because I have my ...
Hamza's user avatar
  • 1
0 votes
1 answer
56 views

Creating generic redux slice to update nested initialState object

I am working with Redux Toolkit to create generic slice to update nested initialState object, but unfortunately because I lack some advanced TS knowledge I cannot find a way how I can achieve that. ...
Ashylen's user avatar
  • 428
-1 votes
0 answers
28 views

Error: (0 , _utils_useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_3__.useIsomorphicLayoutEffect) is not a function

Facing this Unhandled Runtime Error while using @reduxjs/toolkit Error: (0 , utils_useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_3_.useIsomorphicLayoutEffect) is not a function this is my layout....
Aditya Paluskar's user avatar
2 votes
1 answer
24 views

Redux Toolkit AsyncThunk dispatch

Can I access dispatch inside extraReducers? I want to dispatch action based of the asyncThunk function, if it failed or completed. const todosSlice = createSlice({ name: "todos", ...
Nikon George's user avatar

1
2 3 4 5
710