chore: refactor, rename StoreProvider to StoreBuilder

src/components/Redoc/Redoc.tsx

@@ -13,6 +13,7 @@ import { StickyResponsiveSidebar } from '../StickySidebar/StickyResponsiveSideba
 import { ApiContentWrap, BackgroundStub, RedocWrap } from './styled.elements';
 
 import { SearchBox } from '../SearchBox/SearchBox';
+import { StoreProvider } from '../StoreBuilder';
 
 export interface RedocProps {
   store: AppStore;
@@ -38,6 +39,7 @@ export class Redoc extends React.Component<RedocProps> {
     const store = this.props.store;
     return (
       <ThemeProvider theme={options.theme}>
+        <StoreProvider value={this.props.store}>
           <OptionsProvider value={options}>
             <RedocWrap className="redoc-wrap">
               <StickyResponsiveSidebar menu={menu} className="menu-content">
@@ -55,12 +57,13 @@ export class Redoc extends React.Component<RedocProps> {
               </StickyResponsiveSidebar>
               <ApiContentWrap className="api-content">
                 <ApiInfo store={store} />
-              <ApiDescription store={store} />
+                <ApiDescription description={store.spec.info.description} />
                 <ContentItems items={menu.items as any} />
               </ApiContentWrap>
               <BackgroundStub />
             </RedocWrap>
           </OptionsProvider>
+        </StoreProvider>
       </ThemeProvider>
     );
   }

src/components/RedocStandalone.tsx

@@ -5,7 +5,7 @@ import { RedocNormalizedOptions, RedocRawOptions } from '../services/RedocNormal
 import { ErrorBoundary } from './ErrorBoundary';
 import { Loading } from './Loading/Loading';
 import { Redoc } from './Redoc/Redoc';
-import { StoreProvider } from './StoreProvider';
+import { StoreBuilder } from './StoreBuilder';
 
 export interface RedocStandaloneProps {
   spec?: object;
@@ -44,7 +44,7 @@ export class RedocStandalone extends React.PureComponent<RedocStandaloneProps> {
 
     return (
       <ErrorBoundary>
-        <StoreProvider spec={spec} specUrl={specUrl} options={options} onLoaded={onLoaded}>
+        <StoreBuilder spec={spec} specUrl={specUrl} options={options} onLoaded={onLoaded}>
           {({ loading, store }) =>
             !loading ? (
               <Redoc store={store!} />
@@ -52,7 +52,7 @@ export class RedocStandalone extends React.PureComponent<RedocStandaloneProps> {
               <Loading color={normalizedOpts.theme.colors.primary.main} />
             )
           }
-        </StoreProvider>
+        </StoreBuilder>
       </ErrorBoundary>
     );
   }

src/components/StoreBuilder.ts

@@ -1,11 +1,11 @@
 import memoize from 'memoize-one';
-import { Component } from 'react';
+import { Component, createContext } from 'react';
 
 import { AppStore } from '../services/';
 import { RedocRawOptions } from '../services/RedocNormalizedOptions';
 import { loadAndBundleSpec } from '../utils';
 
-export interface StoreProviderProps {
+export interface StoreBuilderProps {
   specUrl?: string;
   spec?: object;
   store?: AppStore;
@@ -17,7 +17,7 @@ export interface StoreProviderProps {
   children: (props: { loading: boolean; store?: AppStore }) => any;
 }
 
-export interface StoreProviderState {
+export interface StoreBuilderState {
   error?: Error;
   loading: boolean;
   resolvedSpec?: any;
@@ -25,8 +25,11 @@ export interface StoreProviderState {
   prevSpecUrl?: string;
 }
 
-export class StoreProvider extends Component<StoreProviderProps, StoreProviderState> {
+const { Provider, Consumer } = createContext<AppStore | undefined>(undefined);
-  static getDerivedStateFromProps(nextProps: StoreProviderProps, prevState: StoreProviderState) {
+export { Provider as StoreProvider, Consumer as StoreConsumer };
+
+export class StoreBuilder extends Component<StoreBuilderProps, StoreBuilderState> {
+  static getDerivedStateFromProps(nextProps: StoreBuilderProps, prevState: StoreBuilderState) {
     if (nextProps.specUrl !== prevState.prevSpecUrl || nextProps.spec !== prevState.prevSpec) {
       return {
         loading: true,
@@ -39,7 +42,7 @@ export class StoreProvider extends Component<StoreProviderProps, StoreProviderSt
     return null;
   }
 
-  state: StoreProviderState = {
+  state: StoreBuilderState = {
     loading: true,
     resolvedSpec: null,
   };

src/components/index.ts

@@ -25,7 +25,7 @@ export * from './PayloadSamples/PayloadSamples';
 export * from './MediaTypeSwitch/MediaTypesSwitch';
 
 export * from './ErrorBoundary';
-export * from './StoreProvider';
+export * from './StoreBuilder';
 export * from './OptionsProvider';
 export * from './SideMenu/';
 export * from './StickySidebar/StickyResponsiveSidebar';