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

Iterative move to New React Context API

    XMLWordPrintable

Details

    Description

      Proposal:
      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
        this.context.stripes
        

        gets changed to

        this.props.stripes

        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

        Attachments

          Issue Links

            Activity

              People

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

                Dates

                  Created:
                  Updated:
                  Resolved:

                  Time Tracking

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

                    TestRail: Runs

                      TestRail: Cases