feat(di): rename ComponentRegistryConsumer to RegistryConsumer

bem · Jun 23, 2021 · 2420041 · 2420041
1 parent da8e1eb
commit 2420041
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 74 deletions.
diff --git a/packages/di/README.md b/packages/di/README.md
@@ -138,26 +138,26 @@ export const App = () => (
 
 Now the dependencies can be injected based on the currently used registry
 
-with `ComponentRegistryConsumer`
+with `RegistryConsumer`
 
 ```tsx
 import React from 'react'
 import { cn } from '@bem-react/classname'
-import { ComponentRegistryConsumer } from '@bem-react/di'
+import { RegistryConsumer } from '@bem-react/di'
 
 // No Header or Footer imports
 
 const cnApp = cn('App')
 
 export const App = () => (
-  <ComponentRegistryConsumer id={cnApp()}>
+  <RegistryConsumer id={cnApp()}>
     {({ Header, Footer }) => (
       <>
         <Header />
         <Footer />
       </>
     )}
-  </ComponentRegistryConsumer>
+  </RegistryConsumer>
 )
 ```
 

diff --git a/packages/di/di.tsx b/packages/di/di.tsx
@@ -11,10 +11,9 @@ import React, {
 export type RegistryContext = Record<string, Registry>
 
 export const registryContext = createContext<RegistryContext>({})
+const RegistriesConsumer = registryContext.Consumer
 const RegistryProvider = registryContext.Provider
 
-export const RegistryConsumer = registryContext.Consumer
-
 export function withRegistry(...registries: Registry[]): <P>(Component: ComponentType<P>) => FC<P>
 export function withRegistry() {
   // Use arguments instead of rest-arguments to get faster and more compact code.
@@ -25,7 +24,7 @@ export function withRegistry() {
       const providedRegistriesRef = useRef<RegistryContext | null>(null)
 
       return (
-        <RegistryConsumer>
+        <RegistriesConsumer>
           {(contextRegistries) => {
             if (providedRegistriesRef.current === null) {
               const providedRegistries = { ...contextRegistries }
@@ -53,7 +52,7 @@ export function withRegistry() {
               </RegistryProvider>
             )
           }}
-        </RegistryConsumer>
+        </RegistriesConsumer>
       )
     }
 
@@ -67,13 +66,13 @@ export function withRegistry() {
   }
 }
 
-export interface IComponentRegistryConsumerProps {
+export interface IRegistryConsumerProps {
   id: string
   children: (registry: any) => ReactNode
 }
 
-export const ComponentRegistryConsumer: FC<IComponentRegistryConsumerProps> = (props) => (
-  <RegistryConsumer>
+export const RegistryConsumer: FC<IRegistryConsumerProps> = (props) => (
+  <RegistriesConsumer>
     {(registries) => {
       if (__DEV__) {
         if (!registries[props.id]) {
@@ -83,9 +82,14 @@ export const ComponentRegistryConsumer: FC<IComponentRegistryConsumerProps> = (p
 
       return props.children(registries[props.id].snapshot())
     }}
-  </RegistryConsumer>
+  </RegistriesConsumer>
 )
 
+/**
+ * @deprecated consider using 'RegistryConsumer' instead
+ */
+export const ComponentRegistryConsumer = RegistryConsumer
+
 export const useRegistries = () => {
   return useContext(registryContext)
 }

diff --git a/packages/di/test/di.test.tsx b/packages/di/test/di.test.tsx
@@ -1,14 +1,7 @@
 import React from 'react'
 import { render } from 'enzyme'
 
-import {
-  Registry,
-  withRegistry,
-  RegistryConsumer,
-  ComponentRegistryConsumer,
-  useRegistries,
-  useRegistry,
-} from '../di'
+import { Registry, withRegistry, RegistryConsumer, useRegistries, useRegistry } from '../di'
 import { compose } from '../../core/core'
 
 interface ICommonProps {
@@ -155,7 +148,7 @@ describe('@bem-react/di', () => {
     })
 
     describe('consumer', () => {
-      test('should provide registry to context', () => {
+      test('should provide registry with component', () => {
         const compositorRegistry = new Registry({ id: 'Compositor' })
         const Element: React.FC<ICommonProps> = () => <span>content</span>
 
@@ -166,35 +159,9 @@ describe('@bem-react/di', () => {
         compositorRegistry.set('Element', Element)
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <RegistryConsumer>
-            {(registries) => {
-              const registry = registries.Compositor
-              const { Element } = registry.snapshot<ICompositorRegistry>()
-
-              return <Element />
-            }}
-          </RegistryConsumer>
-        )
-
-        const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
-
-        expect(render(<Compositor />).text()).toEqual('content')
-      })
-
-      test('should provide assign registry with component', () => {
-        const compositorRegistry = new Registry({ id: 'Compositor' })
-        const Element: React.FC<ICommonProps> = () => <span>content</span>
-
-        interface ICompositorRegistry {
-          Element: React.ComponentType<ICommonProps>
-        }
-
-        compositorRegistry.set('Element', Element)
-
-        const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element }: ICompositorRegistry) => <Element />}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -218,9 +185,9 @@ describe('@bem-react/di', () => {
 
         const CompositorPresenter: React.FC<ICommonProps> = () => {
           const Content: React.FC<ICommonProps> = withRegistry(overridedCompositorRegistry)(() => (
-            <ComponentRegistryConsumer id="Compositor">
+            <RegistryConsumer id="Compositor">
               {({ Element }: ICompositorRegistry) => <Element />}
-            </ComponentRegistryConsumer>
+            </RegistryConsumer>
           ))
 
           return <Content />
@@ -246,9 +213,9 @@ describe('@bem-react/di', () => {
         overridedCompositorRegistry.set('Element', OverridedElement)
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element }: ICompositorRegistry) => <Element />}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -276,14 +243,14 @@ describe('@bem-react/di', () => {
         overridedCompositorRegistry.set('Element1', OverridedElement)
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element1, Element2 }: ICompositorRegistry) => (
               <>
                 <Element1 />
                 <Element2 />
               </>
             )}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -325,14 +292,14 @@ describe('@bem-react/di', () => {
         })
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element1, Element2 }: ICompositorRegistry) => (
               <>
                 <Element1 />
                 <Element2 />
               </>
             )}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -364,13 +331,13 @@ describe('@bem-react/di', () => {
         )
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ prop, functionProp }: ICompositorRegistry) => (
               <div>
                 {prop} / {functionProp()}
               </div>
             )}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -402,14 +369,14 @@ describe('@bem-react/di', () => {
         }
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element1, Element2 }: ICompositorRegistry) => (
               <>
                 <Element1 />
                 <Element2 />
               </>
             )}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -425,14 +392,14 @@ describe('@bem-react/di', () => {
         const element2Registry = new Registry({ id: 'Element2' })
         const Element1: React.FC<ICommonProps> = () => <span>content</span>
         const Element2Presenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element }: ICompositorRegistry) => (
               <>
                 <Element />
                 extra
               </>
             )}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
         const Element2 = withRegistry(element2Registry)(Element2Presenter)
 
@@ -445,9 +412,9 @@ describe('@bem-react/di', () => {
         compositorRegistry.set('Element2', Element2)
 
         const CompositorPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="Compositor">
+          <RegistryConsumer id="Compositor">
             {({ Element2 }: ICompositorRegistry) => <Element2 />}
-          </ComponentRegistryConsumer>
+          </RegistryConsumer>
         )
 
         const Compositor = withRegistry(compositorRegistry)(CompositorPresenter)
@@ -466,9 +433,7 @@ describe('@bem-react/di', () => {
         registryB.set('Element', elementB)
 
         const ElementPresenter: React.FC<ICommonProps> = () => (
-          <ComponentRegistryConsumer id="TestRegistry">
-            {({ Element }) => <Element />}
-          </ComponentRegistryConsumer>
+          <RegistryConsumer id="TestRegistry">{({ Element }) => <Element />}</RegistryConsumer>
         )
 
         const BranchA = withRegistry(registryA)(ElementPresenter)
@@ -495,9 +460,7 @@ describe('@bem-react/di', () => {
       registryA.set('ElementA', ElementA)
 
       const ElementAPresenter: React.FC<ICommonProps> = () => (
-        <ComponentRegistryConsumer id="TestRegistry">
-          {({ ElementA }) => <ElementA />}
-        </ComponentRegistryConsumer>
+        <RegistryConsumer id="TestRegistry">{({ ElementA }) => <ElementA />}</RegistryConsumer>
       )
 
       const ElementB = (_props: ICommonProps) => <span>content of elementB</span>
@@ -506,9 +469,7 @@ describe('@bem-react/di', () => {
       registryB.set('ElementB', ElementB)
 
       const ElementBPresenter: React.FC<ICommonProps> = () => (
-        <ComponentRegistryConsumer id="TestRegistry">
-          {({ ElementB }) => <ElementB />}
-        </ComponentRegistryConsumer>
+        <RegistryConsumer id="TestRegistry">{({ ElementB }) => <ElementB />}</RegistryConsumer>
       )
 
       const AppA = withRegistry(registryA, registryB)(ElementAPresenter)