Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Sep 10 2018 02:41
    Naiba01 commented #1157
  • Sep 05 2018 18:37
    govarthananve commented #1080
  • Sep 05 2018 17:12
    carloquilala opened #1349
  • Aug 07 2018 11:42
    carloquilala edited #1348
  • Aug 07 2018 11:14
    carloquilala opened #1348
  • Jul 31 2018 06:46
    zaoansijia commented #1347
  • Jul 13 2018 01:45
    gapsaras commented #842
  • Jul 12 2018 10:08
    grootendorste commented #930
  • Jul 02 2018 15:06
    aozfen commented #1092
  • Jun 25 2018 17:25
    olliecaine27 closed #1268
  • Jun 03 2018 17:30
    olliecaine27 synchronize #1268
  • Jun 03 2018 17:16
    olliecaine27 synchronize #1268
  • May 22 2018 05:14
    ishan123456789 commented #1220
  • May 19 2018 08:38
    MirShi opened #1347
  • May 14 2018 19:53
    samanthi22 closed #1346
  • May 14 2018 19:53
    samanthi22 commented #1346
  • May 05 2018 17:33
    samanthi22 opened #1346
  • Apr 22 2018 09:28
    m-ketan closed #1319
  • Apr 20 2018 00:40
    matthew-dean commented #658
  • Apr 02 2018 12:36
    AndrewSavetchuk commented #1080
csjohn
@csjohn

@mrweissx_twitter I've been playing around with it a bit but can't seem to get the functionality I expect.

I'm using console.log(props, this.props) from the sub-routes component constructor (class defined component) but am seeing only empty objects. The sub-routes index.js is basically the same as the demo and other (with the exception that it's nested).

I've thrown console.logs throughout and have confirmed that the route logic is being called (like the call to connect() and I even see the reducer and state update in the Redux dev tools, I just can't seem to get the injection of the props into the sub-route component working in the same way the top level routes work.

csjohn
@csjohn
not the connected component
jakehm
@jakehm
I'm trying to implement firebase auth. When I hit the register button, the error reads "this.props.register(. . .).then is not a function
jakehm
@jakehm
but it's still registering new users even though errors pop up in the console
csjohn
@csjohn
@mrweissx_twitter thanks for getting back to me on that, you're totally right :) Importing the container (that has the export connect(... call was the proper thing to do.
csjohn
@csjohn
How are people generally going about setting initial redux state given the fractal pattern of the starter kit?
csjohn
@csjohn
Oh I think it's done within the "module" alongside the reducer definition
Tobias Lundgren
@lundgren2
Hi, I have an simple question. I’m using redux to store props with all my customers and now I only want to list all customers that have country = SE. How can I do this check in react/redux? and then list it in an <li> with .map() or something like that?
Roman Pearah
@neverfox
@lundgren2 Lots of ways you could handle that, but try setting the filter in state also (because that's what it is) and then write a selector for the customers your view sees that either returns all customers or customers filtered as appropriate.
Tobias Lundgren
@lundgren2

@neverfox thanks for your reply! I have tried to solve that by Assign the two objects like this:

export function selectCustomer(id) {
  return (dispatch) => {
    return fetch(`/api/customer/get/${id}`, {method: 'get'}).then((response) => {
      if (response.ok) {
        return response.json().then((json) => {
          dispatch(fetchCustomerAddons(id)).then((response) => {
            !response.error ? (
              response.payload.data != null ? (
               json = Object.assign(json, response.payload.data),
               dispatch({type: SELECT_CUSTOMER, customer: json})
             ) : dispatch({type: SELECT_CUSTOMER, customer: json})
           ) : ''
          })
        })
      }
    })
  };
}

Is that an good (and fast way) to do this?

This is my action function now...
Roman Pearah
@neverfox
sure
not sure what that has to do with your previous question though
Tobias Lundgren
@lundgren2
Oh, sorry! Before this two fetch were two different functions. the first were setting and prop = customer, and one other prop = customerAddons...
Now I have combined those two functions til one
Jon Earley
@jonearley
Would anyone have an example to share for setting up a fractal sub-routes?

Looking back I found this resource: davezuko/react-redux-starter-kit#797.

I'll start here.

jakehm
@jakehm
So is it true you need to do routing with plainRoute objects for lazy loading?
we are using it as component : CoreLayout
jakehm
@jakehm
@adityashankert
//CoreLayoutContainer.js
import { connect } from 'react-redux'
import { login, register, fetchUser, logout } from 'store/user'

import CoreLayout from './CoreLayout'

const mapStateToProps = state => ({
  currentUser: state.currentUser
})

const mapDispatchToProps = {
  login,
  register,
  fetchUser,
  logout
}

export default connect(mapStateToProps, mapDispatchToProps)(CoreLayout)
aditya shanker tagirisa
@adityashankert
Where should we write this ?
Sorry I'm damn new to this
jakehm
@jakehm
this is the component you add to your route
// routes/index.js
import CoreLayout from '/layouts/Corelayout/CorelayoutContainer.js
//...
export const createRoutes = (store) => ({
  path: '/',
  component: CoreLayout,
//  ...
aditya shanker tagirisa
@adityashankert
import React from 'react'
export const CoreLayout = ({ children }) => (
 <div>
     {children}
 </div>

)

InternalLayout.propTypes = {
  children : React.PropTypes.element.isRequired
}

export default CoreLayout
currently this is the corelayout code from where i will get to access the props?
joshuaandrewhoffman
@joshuaandrewhoffman

Can anyone weigh in on a best practices question? I'm refactoring towards better componentization (I jammed tons into one component/module/container pair). So far so good, with the exception of what I should do with my action handlers/reducer code.

Should these all live in my high level component for this route? Should I break them down to the component level where they're generated? (I don't think I can just repeat the injectReducer pattern in my index.js because I'd overwrite the key)

I'm looking more for theory on a smart way to architect this vs technical help on how to do it, but I'm still learning so I may be naive to technical limitations. Happy to give specifics on the project if it'll help, but I don't wanna spam irrelevant detail if not. I have a few more thoughts as to options here but I don't want to make this into a giant wall of text /shrug

jakehm
@jakehm
@joshuaandrewhoffman You can either put new actions in the store folder or in the module folder of a specific route, like routes/counter/modules
If the actions were only being used by a single route, I would put them in a modules folder.
jakehm
@jakehm
and you can inject as many reducers as you want. Just change the key.
joshuaandrewhoffman
@joshuaandrewhoffman
@jakehm so there's no actual dependency created between the store name and the reducer name? In the examples they're the same so I assumed some plumbing/magic was happening somewhere I hadn't found yet. As I'm typing it though that magic sounds inconsistent with my understanding of how reducers work in redux 😅 so I think maybe I get why the key change would work.
Thanks a ton for the input on this! I'm glad I decided to do this refactor, I'm learning a lot of stuff I missed or didn't fully grok
Nilay Kothari
@kotharinilay
hey all,
I am new to redux, just wanted to ask what data should store in redux store?
Is it good to store form data in redux store?
How often should I connect to store to update data (i.e. is it fine to update store data on text field change event?), which don't affect performance?
help me to get it started..
jakehm
@jakehm
@kotharinilay it does affect performance but you can do it. If you don't need to update the state every time the user types a new letter, I would use refs to only update state on submit
jakehm
@jakehm
If you are asking about putting the value in the store vs state, I think the performance is the same.
jakehm
@jakehm
When I save changes to components, there's no reload, but when I make changes to stuff that isn't as deep, like routes, reload does work. Anyone know what's going on?
jakehm
@jakehm
i did yarn clean, which is the script for rifram and it kind of broke everything
jakehm
@jakehm
also are there any plans to move to rr 4 soon? I think I need it for my hmr to work.
bytewiz
@bytewiz
@kotharinilay both your questions very much depend on what you are trying to do. Do you have some use case or example?
Sanjin Šarić
@sanjin-saric

Hi guys. I would like to import a stylesheet that would be local and NOT loaded from cdn, how do I do that?

For example how would I add bootstrap.sass (from node modules) to be loaded locally.

Terry Raimondo
@terry90
Hey, is there something simpler than Counter/index.js to declare the component ? Why is it important to do it async ? I'm kinda new to React and Redux so I do not want to add more noise to my brain, already much things to learn. The thing is I don't understand require.ensure([], (require) => :heart:
mrweissx
@mrweissx_twitter
@terry90 this is to support webpack code splitting (https://webpack.github.io/docs/code-splitting.html)
@terry90 so instead of your entire app existing in 1 large .js file, you can split separate routes into separate files that are loaded on demand
Félix Bayart
@yukulelix
Hi guys ! I wanted your advices on what would be the best strategy to implement a first async fetch when loading a new route.
As the components should remain purely functional, I guess adding a componentDidMount isn't the right way to go ??
VisionCptn
@VisionCptn
Hello guys, sry foe noobie question, but is this starter kit isomorphic.
Roman Pearah
@neverfox
@yukulelix You might consider responding to a LOCATION_CHANGE action using react-router-redux and redux-saga.
VisionCptn
@VisionCptn
can smb tell me what is path from index.html to npm folder.