Skip to content

Commit

Permalink
[breaking] RestProvider -> CacheProvider
Browse files Browse the repository at this point in the history
  • Loading branch information
ntucker committed Jul 12, 2019
1 parent cfeb9a8 commit 2a73353
Show file tree
Hide file tree
Showing 27 changed files with 69 additions and 70 deletions.
2 changes: 1 addition & 1 deletion docs/README.md
Expand Up @@ -15,7 +15,7 @@
- [useSubscription](api/useSubscription.md)
- [useRetrieve](api/useRetrieve.md)
- Components:
- [RestProvider](api/RestProvider.md)
- [CacheProvider](api/CacheProvider.md)
- [ExternalCacheProvider](api/ExternalCacheProvider.md)
- [NetworkErrorBoundary](api/NetworkErrorBoundary.md)
- [Manager](api/Manager.md)s
Expand Down
8 changes: 4 additions & 4 deletions docs/api/RestProvider.md → docs/api/CacheProvider.md
@@ -1,5 +1,5 @@
---
title: <RestProvider />
title: <CacheProvider />
---
Manages state, providing all context needed to use the hooks. Should be placed as high as possible
in application tree as any usage of the hooks is only possible for components below the provider
Expand All @@ -8,13 +8,13 @@ in the React tree.
`index.tsx`

```tsx
import { RestProvider } from 'rest-hooks';
import { CacheProvider } from 'rest-hooks';
import ReactDOM from 'react-dom';

ReactDOM.render(
<RestProvider>
<CacheProvider>
<App />
</RestProvider>,
</CacheProvider>,
document.body
);
```
Expand Down
2 changes: 1 addition & 1 deletion docs/api/ExternalCacheProvider.md
Expand Up @@ -5,7 +5,7 @@ Integrates external stores with `rest-hooks`. Should be placed as high as possib
in application tree as any usage of the hooks is only possible for components below the provider
in the React tree.

**Is a replacement for \<RestProvider /> - do _NOT_ use both at once**
**Is a replacement for \<CacheProvider /> - do _NOT_ use both at once**

`index.tsx`

Expand Down
2 changes: 1 addition & 1 deletion docs/api/Manager.md
Expand Up @@ -30,7 +30,7 @@ interface Manager {
## getMiddleware()

getMiddleware() returns a function that is 100% redux compatible. This enables it to be integrated into redux,
or used by the internal useReducer() enhancer in <RestProvider />.
or used by the internal useReducer() enhancer in <CacheProvider />.

Middlewares will intercept actions that are dispatched and then potentially dispatch their own actions as well.
To read more about middlewares, see the [redux documentation](https://redux.js.org/advanced/middleware).
Expand Down
6 changes: 3 additions & 3 deletions docs/api/NetworkErrorBoundary.md
Expand Up @@ -22,7 +22,7 @@ Custom fallback usage example:

```tsx
import React from 'react';
import { RestProvider, NetworkErrorBoundary, NetworkError } from 'rest-hooks';
import { CacheProvider, NetworkErrorBoundary, NetworkError } from 'rest-hooks';

function ErrorPage({ error }: { error: NetworkError }) {
return (
Expand All @@ -34,11 +34,11 @@ function ErrorPage({ error }: { error: NetworkError }) {

export default function App(): React.ReactElement {
return (
<RestProvider>
<CacheProvider>
<NetworkErrorBoundary fallbackComponent={ErrorPage}>
<Router />
</NetworkErrorBoundary>
</RestProvider>
</CacheProvider>
);
}
```
Expand Down
8 changes: 4 additions & 4 deletions docs/api/PollingSubscription.md
Expand Up @@ -10,15 +10,15 @@ Will dispatch a `fetch` action at the minimum interval of all subscriptions to t
resource.

```tsx
import { SubscriptionManager, PollingSubscription, RestProvider } from 'rest-hooks';
import { SubscriptionManager, PollingSubscription, CacheProvider } from 'rest-hooks';
import ReactDOM from 'react-dom';

const subscriptionManager = new SubscriptionManager(PollingSubscription);

ReactDOM.render(
<RestProvider subscriptionManager={subscriptionManager}>
<CacheProvider subscriptionManager={subscriptionManager}>
<App />
</RestProvider>,
</CacheProvider>,
document.body
);
```
Expand All @@ -29,4 +29,4 @@ ReactDOM.render(

> #### Note:
>
> This is already used by `RestProvider` by default.
> This is already used by `CacheProvider` by default.
4 changes: 2 additions & 2 deletions docs/api/README.md
Expand Up @@ -16,7 +16,7 @@ title: API Reference
- [useInvalidator](useInvalidator.md)

## Components
- [RestProvider](RestProvider.md)
- [CacheProvider](CacheProvider.md)
- [ExternalCacheProvider](ExternalCacheProvider.md)
- [NetworkErrorBoundary](NetworkErrorBoundary.md)

Expand All @@ -36,6 +36,6 @@ to production themselves.

- [\<MockProvider />](MockProvider)
- [makeRenderRestHook()](makeRenderRestHook)
- [makeRestProvider()](makeRestProvider)
- [makeCacheProvider()](makeCacheProvider)
- [makeExternalCacheProvider()](makeExternalCacheProvider)

2 changes: 1 addition & 1 deletion docs/api/RequestShape.md
Expand Up @@ -5,7 +5,7 @@ title: RequestShape

`RequestShape` is the most basic interface sent to hooks telling rest-hooks how to
handle the request. Several methods of `Resource` return `RequestShapes`, which offers a bridge between
both APIs. In fact, using `Resource` is not even needed to work with `RestProvider` and
both APIs. In fact, using `Resource` is not even needed to work with `CacheProvider` and
simply operates as a convenience to organize schemas.

Because of the different capabilities of each shape, some shapes won't be usable with
Expand Down
@@ -1,16 +1,16 @@
---
title: makeRestProvider()
title: makeCacheProvider()
---

```typescript
declare const makeRestProvider: (
declare const makeCacheProvider: (
manager: NetworkManager,
subscriptionManager: SubscriptionManager<any>,
initialState?: State<unknown>,
) => ({ children }: { children: React.ReactNode }) => JSX.Element;
```

Used to build a [\<RestProvider />](./RestProvider.md) for [makeRenderRestHook()](./makeRenderRestHook.md)
Used to build a [\<CacheProvider />](./CacheProvider.md) for [makeRenderRestHook()](./makeRenderRestHook.md)

## Arguments

Expand All @@ -33,7 +33,7 @@ Simple wrapper component that only has child as prop.
```tsx
const manager = new MockNetworkManager();
const subscriptionManager = new SubscriptionManager(PollingSubscription);
const Provider = makeRestProvider(manager, subscriptionManager);
const Provider = makeCacheProvider(manager, subscriptionManager);

function renderRestHook<T>(callback: () => T) {
return renderHook(callback, {
Expand Down
6 changes: 3 additions & 3 deletions docs/api/makeRenderRestHook.md
Expand Up @@ -26,7 +26,7 @@ type ProviderType = (
Function to generate the provider used in `renderRestHook()`. The purpose of this is to unify construction of
providers as they both are initialized in a very different fashion.

- [makeRestProvider()](./makeRestProvider.md)
- [makeCacheProvider()](./makeCacheProvider.md)
- [makeExternalCacheProvider()](./makeExternalCacheProvider.md)

## Returns
Expand Down Expand Up @@ -90,7 +90,7 @@ Cleans up all managers used in tests. Should be run in `afterEach()` to ensure e
## Example

```typescript
import { makeRenderRestHook, makeRestProvider } from 'rest-hooks/test';
import { makeRenderRestHook, makeCacheProvider } from 'rest-hooks/test';

const payload = {
id: 5,
Expand All @@ -103,7 +103,7 @@ beforeEach(() => {
nock('http://test.com')
.get(`/article-cooler/${payload.id}`)
.reply(200, payload);
renderRestHook = makeRenderRestHook(makeRestProvider);
renderRestHook = makeRenderRestHook(makeCacheProvider);
});

afterEach(() => {
Expand Down
6 changes: 3 additions & 3 deletions docs/getting-started/installation.md
Expand Up @@ -63,13 +63,13 @@ import 'core-js/stable';
#### `index.tsx`

```tsx
import { RestProvider } from 'rest-hooks';
import { CacheProvider } from 'rest-hooks';
import ReactDOM from 'react-dom';

ReactDOM.render(
<RestProvider>
<CacheProvider>
<App />
</RestProvider>,
</CacheProvider>,
document.body
);
```
Expand Down
2 changes: 1 addition & 1 deletion docs/guides/redux.md
Expand Up @@ -26,7 +26,7 @@ npm install redux
Note: react-redux is _not_ needed for this integration (though you can use it if you want).

Then you'll want to use the [\<ExternalCacheProvider />](../api/ExternalCacheProvider.md) instead of
[\<RestProvider />](../api/RestProvider.md) and pass in the store and a selector function to grab
[\<CacheProvider />](../api/CacheProvider.md) and pass in the store and a selector function to grab
the rest-hooks specific part of the state.

> Note: You should only use ONE provider; nested another provider will override the previous.
Expand Down
4 changes: 2 additions & 2 deletions docs/guides/unit-testing-hooks.md
Expand Up @@ -22,7 +22,7 @@ upon test completion.

```typescript
import nock from 'nock';
import { makeRenderRestHook, makeRestProvider } from 'rest-hooks/test';
import { makeRenderRestHook, makeCacheProvider } from 'rest-hooks/test';

describe('useResource()', () => {
let renderRestHook: ReturnType<typeof makeRenderRestHook>;
Expand All @@ -31,7 +31,7 @@ describe('useResource()', () => {
nock('http://test.com')
.get(`/article/0`)
.reply(403, {});
renderRestHook = makeRenderRestHook(makeRestProvider);
renderRestHook = makeRenderRestHook(makeCacheProvider);
});

afterEach(() => {
Expand Down
4 changes: 2 additions & 2 deletions src/index.ts
Expand Up @@ -24,7 +24,7 @@ import {
useMeta,
useError,
useSelectionUnstable,
RestProvider,
CacheProvider,
useInvalidator,
ExternalCacheProvider,
NetworkErrorBoundary,
Expand Down Expand Up @@ -83,7 +83,7 @@ export type ReceiveAction = ReceiveAction;

export {
Resource,
RestProvider,
CacheProvider,
ExternalCacheProvider,
useCache,
useFetcher,
Expand Down
5 changes: 2 additions & 3 deletions src/react-integration/__tests__/hooks.tsx
Expand Up @@ -26,8 +26,7 @@ import { Resource, Schema } from '../../resource';
import { ReadShape } from '../../resource';
import makeRenderRestHook from '../../test/makeRenderRestHook';
import {
makeRestProvider,
makeExternalCacheProvider,
makeCacheProvider,
} from '../../test/providers';

async function testDispatchFetch(
Expand Down Expand Up @@ -477,7 +476,7 @@ describe('useResource()', () => {
await testDispatchFetch(MultiResourceTester, [payload, users]);
});
it('should throw same promise until both resolve', async () => {
const renderRestHook = makeRenderRestHook(makeRestProvider);
const renderRestHook = makeRenderRestHook(makeCacheProvider);
jest.useFakeTimers();
nock('http://test.com')
.get(`/article-cooler/${payload.id}`)
Expand Down
4 changes: 2 additions & 2 deletions src/react-integration/__tests__/integration.tsx
Expand Up @@ -6,15 +6,15 @@ import { CoolerArticleResource, UserResource } from '../../__tests__/common';
import { useResource, useFetcher } from '../hooks';
import makeRenderRestHook from '../../test/makeRenderRestHook';
import {
makeRestProvider,
makeCacheProvider,
makeExternalCacheProvider,
} from '../../test/providers';

afterEach(() => {
cleanup();
});

for (const makeProvider of [makeRestProvider, makeExternalCacheProvider]) {
for (const makeProvider of [makeCacheProvider, makeExternalCacheProvider]) {
describe(`${makeProvider.name} => <Provider />`, () => {
const payload = {
id: 5,
Expand Down
4 changes: 2 additions & 2 deletions src/react-integration/__tests__/subscriptions.tsx
Expand Up @@ -8,14 +8,14 @@ import { PollingArticleResource } from '../../__tests__/common';
import { useSubscription, useCache } from '../hooks';
import makeRenderRestHook from '../../test/makeRenderRestHook';
import {
makeRestProvider,
makeCacheProvider,
makeExternalCacheProvider,
} from '../../test/providers';
import { DispatchContext } from '../context';

afterEach(cleanup);

for (const makeProvider of [makeRestProvider, makeExternalCacheProvider]) {
for (const makeProvider of [makeCacheProvider, makeExternalCacheProvider]) {
describe(`${makeProvider.name} with subscriptions`, () => {
const articlePayload = {
id: 5,
Expand Down
4 changes: 2 additions & 2 deletions src/react-integration/index.ts
Expand Up @@ -10,7 +10,7 @@ import {
useInvalidator,
useSelectionUnstable,
} from './hooks';
import { RestProvider, ExternalCacheProvider } from './provider';
import { CacheProvider, ExternalCacheProvider } from './provider';
import NetworkErrorBoundary, { NetworkError } from './NetworkErrorBoundary';

export type NetworkError = NetworkError;
Expand All @@ -25,7 +25,7 @@ export {
useMeta,
useError,
useSelectionUnstable,
RestProvider,
CacheProvider,
ExternalCacheProvider,
NetworkErrorBoundary,
};
Expand Up @@ -16,7 +16,7 @@ interface ProviderProps {
initialState?: State<unknown>;
}
/** Controller managing state of the REST cache and coordinating network requests. */
export default function RestProvider({
export default function CacheProvider({
children,
manager,
subscriptionManager,
Expand Down Expand Up @@ -47,7 +47,7 @@ export default function RestProvider({
</DispatchContext.Provider>
);
}
RestProvider.defaultProps = {
CacheProvider.defaultProps = {
manager: new NetworkManager(),
subscriptionManager: new SubscriptionManager(PollingSubscription),
};
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<RestProvider /> should change state 1`] = `
exports[`<CacheProvider /> should change state 1`] = `
Object {
"entities": Object {
"http://test.com/article-cooler/": Object {
Expand Down
12 changes: 6 additions & 6 deletions src/react-integration/provider/__tests__/provider.tsx
Expand Up @@ -3,12 +3,12 @@ import { cleanup, act, render } from 'react-testing-library';

import { DispatchContext, StateContext } from '../../context';
import { CoolerArticleResource } from '../../../__tests__/common';
import RestProvider from '../RestProvider';
import CacheProvider from '../CacheProvider';
import NetworkManager from '../../../state/NetworkManager';

afterEach(cleanup);

describe('<RestProvider />', () => {
describe('<CacheProvider />', () => {
it('should not change dispatch function on re-render', () => {
let dispatch;
let count = 0;
Expand All @@ -18,18 +18,18 @@ describe('<RestProvider />', () => {
return null;
}
const chil = <DispatchTester />;
const tree = <RestProvider>{chil}</RestProvider>;
const tree = <CacheProvider>{chil}</CacheProvider>;
const { rerender } = render(tree);
expect(dispatch).toBeDefined();
const curDisp = dispatch;
rerender(tree);
expect(curDisp).toBe(dispatch);
expect(count).toBe(1);
rerender(<RestProvider>{chil}</RestProvider>);
rerender(<CacheProvider>{chil}</CacheProvider>);
expect(curDisp).toBe(dispatch);
expect(count).toBe(1);
const manager = new NetworkManager();
rerender(<RestProvider manager={manager}>{chil}</RestProvider>);
rerender(<CacheProvider manager={manager}>{chil}</CacheProvider>);
expect(curDisp).toBe(dispatch);
expect(count).toBe(1);
rerender(
Expand All @@ -50,7 +50,7 @@ describe('<RestProvider />', () => {
return null;
}
const chil = <ContextTester />;
const tree = <RestProvider>{chil}</RestProvider>;
const tree = <CacheProvider>{chil}</CacheProvider>;
render(tree);
expect(dispatch).toBeDefined();
expect(state).toBeDefined();
Expand Down
4 changes: 2 additions & 2 deletions src/react-integration/provider/index.ts
@@ -1,4 +1,4 @@
import RestProvider from './RestProvider';
import CacheProvider from './CacheProvider';
import ExternalCacheProvider from './ExternalCacheProvider';

export { RestProvider, ExternalCacheProvider };
export { CacheProvider, ExternalCacheProvider };

0 comments on commit 2a73353

Please sign in to comment.