Skip to content
This repository has been archived by the owner on Nov 11, 2023. It is now read-only.

Add support for requestOptions as a method to Poll #113

Merged
merged 2 commits into from
Apr 8, 2019
Merged

Add support for requestOptions as a method to Poll #113

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
041a3a8
Add support for requestOptions as a method to Poll
vxsx Apr 7, 2019
1914b50
Fixed a case with merging request options in Poll
vxsx Apr 8, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions src/Get.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -544,6 +544,27 @@ describe("Get", () => {
expect(children.mock.calls[1][1].loading).toEqual(false);
expect(children.mock.calls[1][0]).toEqual({ id: 1 });
});

it("should add a custom header with requestOptions method", async () => {
nock("https://my-awesome-api.fake", { reqheaders: { foo: "bar" } })
.get("/")
.reply(200, { id: 1 });

const children = jest.fn();
children.mockReturnValue(<div />);

render(
<RestfulProvider base="https://my-awesome-api.fake">
<Get path="" requestOptions={() => ({ headers: { foo: "bar" } })}>
{children}
</Get>
</RestfulProvider>,
);

await wait(() => expect(children.mock.calls.length).toBe(2));
expect(children.mock.calls[1][1].loading).toEqual(false);
expect(children.mock.calls[1][0]).toEqual({ id: 1 });
});
});

describe("actions", () => {
Expand Down
21 changes: 21 additions & 0 deletions src/Poll.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -657,5 +657,26 @@ describe("Poll", () => {
expect(children.mock.calls[1][1].loading).toEqual(false);
expect(children.mock.calls[1][0]).toEqual({ id: 1 });
});

it("should add a custom header with requestOptions method", async () => {
nock("https://my-awesome-api.fake", { reqheaders: { foo: "bar" } })
.get("/")
.reply(200, { id: 1 });

const children = jest.fn();
children.mockReturnValue(<div />);

render(
<RestfulProvider base="https://my-awesome-api.fake">
<Poll path="" requestOptions={() => ({ headers: { foo: "bar" } })}>
{children}
</Poll>
</RestfulProvider>,
);

await wait(() => expect(children.mock.calls.length).toBe(2));
expect(children.mock.calls[1][1].loading).toEqual(false);
expect(children.mock.calls[1][0]).toEqual({ id: 1 });
});
});
});
29 changes: 19 additions & 10 deletions src/Poll.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -339,16 +339,25 @@ function Poll<TData = any, TError = any, TQueryParams = { [key: string]: any }>(
// Compose Contexts to allow for URL nesting
return (
<RestfulReactConsumer>
{contextProps => (
<ContextlessPoll
{...contextProps}
{...props}
requestOptions={{
...contextProps.requestOptions,
...props.requestOptions,
}}
/>
)}
{contextProps => {
const contextRequestOptions =
typeof contextProps.requestOptions === "function"
? contextProps.requestOptions()
: contextProps.requestOptions || {};
const propsRequestOptions =
typeof props.requestOptions === "function" ? props.requestOptions() : props.requestOptions || {};

return (
<ContextlessPoll
{...contextProps}
{...props}
requestOptions={{
...contextRequestOptions,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Almost perfect! But you need to use merge from lodash here, so we can add a header without erase these set in the Provider

Example:
https://github.com/contiamo/restful-react/blob/master/src/useGet.tsx#L87

and the associate test:

restful-react/src/useGet.test.tsx

Lines 512 to 533 in eaa37d2

it("should merge headers with providers", async () => {
nock("https://my-awesome-api.fake", { reqheaders: { foo: "bar", bar: "foo" } })
.get("/")
.reply(200, { oh: "my god 😍" });
const MyAwesomeComponent = () => {
const { data, loading } = useGet<{ oh: string }>({ path: "/", requestOptions: { headers: { foo: "bar" } } });
return loading ? <div data-testid="loading">Loading…</div> : <div data-testid="data">{data.oh}</div>;
};
const { getByTestId } = render(
<RestfulProvider base="https://my-awesome-api.fake" requestOptions={() => ({ headers: { bar: "foo" } })}>
<MyAwesomeComponent />
</RestfulProvider>,
);
await waitForElement(() => getByTestId("data"));
expect(getByTestId("data")).toHaveTextContent("my god 😍");
});
});

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right, good catch, thanks!

Fixed and added a test.

...propsRequestOptions,
}}
/>
);
}}
</RestfulReactConsumer>
);
}
Expand Down