Mgiyuk

Wrapping Provider in same component throws Element type is invalid: expected a string (for built-in components) or a class/function but got: object I wrote a simple counter example in both Mobx & Redux & it works Full demo is available https://codesandbox.io/s/nw303w6jxl But if I remove Provider from ./src/index.js Provider ./src/index.js const App = () => ( ); & put it in ./src/redux.js while default exporting it throws an error ./src/redux.js export default ( <Provider store={store}> <ConnectReduxApp /> </Provider> ); Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function but got: object Its working but I don't know why its happening? I checked the typeof the default exported function from ./src/redux.js ,i.e, typeof ./src/redux.js console.log( typeof( <Provider store={store}> <ConnectReduxApp /> ...

Redux action is working but reducer is not Not sure why my reducer is not working. I have a console.log in my actions file. So for example, when I test out a failed login attempt, I see the console log in both the loginFromAPI function and loginFailure function (see in actions.js below) . These are outputting what is expected. But for some reason, the login reducer is not working. When I console.log in the loginReducer.js , I see nothing. This tells me that although the action is working, the reducer is not. My redux props do not change from the initial state (I've checked this by outputting to the console). I'd appreciate any help solving this issue. Here is the file structure: app reducers loginReducer.js rootReducer.js screens Login Login.js index.js actions.js store configureStore.js App.js actionTypes.js File configureStore.js configureStore.js import { createStore, applyMiddleware } from 'redux'; import a...

rn redux-offline delete request data/cache just got stuck in configuring react-native offline requests. I want to use it to send data and image files as base64 array with it, well i got it working but after that caches grows constantly day 140mb/4h while testing in real-device, that suppose not the way it should work. What i am missing in general?. store configuration with custom request(converting images to base64) offlineConfig2 = { ...offlineConfig, persistCallback: () => { console.log('Rehydratation complete'); }, persistOptions: { key: 'primary', storage:AsyncStorage }, rehydrate: true, // @overwrite effect effect: (effect, action) => { console.log(`Executing effect for ${action.type}:`, effect); photoArr = ; if (effect.photo) photoArr = effect.photo; promises = photoArr.map(function(photo){ return base64 = RNFetchBlob.fs.readFile(photo.key, 'base64') .then((data) ...

React + redux project not launching with instructions This is my first React + Redux project, it works when I run it in my PC but when people follow my github instructions to run the project on their computers they get an error. "command not found: yarn" Can anyone help me with this issue please? I wonder if my instructions are wrong in the first place https://github.com/itsandromeda/Shoes-Store If anyone gets to launch it succesfully without any errors please let me know. Instructions: Install dependencies npm install Install json server npm install -g json-server Run json server json-server --watch db.json --port 3001 Launch project yarn start please add the error that they get, using my ubuntu i get json-server: command not found , but i make it working. it could be not working on linux. – Lefi Tarik Jun 25 at 16:43 ...

Redux state update causing React component to render unnecessarily I’m experiencing a few performance issues in my react / redux app. I’m working with an object in one of my reducers which is quite deep. It contains an object named list which holds a collection of objects. list const state = { list: { one: { id: 'one', name: 'One', active: false }, two: { id: 'two', name: 'Two', active: false } } } Each item in the object is used to render a component. This component will access the properties of the item like so: const List = (props) => { const listItems = Object.keys(props.list).map((key) => { const item = props.list[key]; return ( <Item key={item.id} active={item.active}> {item.name} </Item> ); }); return <ul>{listItems}</ul>; }; However, every time I run through the following code, my component (which is a PureComponent) render...