Uploaded image for project: 'stripes-core'
  1. stripes-core
  2. STCOR-208

Iterative move to New React Context API




      New React Context API can work simultaneously with the old context. New components should be able to make use of the new way and it should be the way from here forward.

      1. use React.createContext() in stripes-core to create <StripesContext.Provider> and <StripesContext.Consumer>. Old context stripes can remain while it still works... but by the instant that it's gone (React 17) everything should have moved on a while back.
      2. create withStripes() HoC for simply wrapping components that require the stripes context. (also in core.) To help, it should make use of React.forwardRefs() docs on React.forwardRefs
      3. add `stripes` prop to components that need it... for conversion from the "old" context, this means that occurrences of

        gets changed to


        within the component. Logic that used the old way should survive this.

      4. enjoy testing components with only props and without any harness/scaffolding.
      5. if we find ourselves seeing bottlenecks in rendering, it becomes ideal for stripes' keys to break off from stripes and have their own exclusive Provider/consumer pairs - <IntlContext.Consumer>, for example, will get used in many places. It'll need its own ref-forwarding HoC.
      6. New things to add to stripes old context should get their own Provider/Consumer pair, and the new Context API put to use.
      7. If importing HoC's directly from stripes-core is a pain/unwanted, one idea is a peer repo (dep of core for those Providers it would have to render) that would effectively split the "core contextual data" from the "core ui". Providers, Consumers, HoC's would all come from here due to the way React.CreateContext() works. It could start at version 1.0.0 and potentially never reach version 2, so that a single version would always be present (semver fun/abuse?)
      8. sets of keys can be supplied in context, but the potential rendering bottleneck still stands. How often the updates occur and implementation will need to be considered. See React Context Caveats for the object-passing gotcha.

      TestRail: Results


          Issue Links



                rjruizes Roman Ruiz-Esparza
                JohnC John Coburn
                0 Vote for this issue
                8 Start watching this issue



                  Time Tracking

                    Original Estimate - Not Specified
                    Not Specified
                    Remaining Estimate - 0 minutes
                    Time Spent - 2 hours, 30 minutes
                    2h 30m

                    TestRail: Runs

                      TestRail: Cases