Skip to content
13 changes: 6 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -192,11 +192,15 @@ const App = () => (
<details open><summary><b>Destructured <code>useFetch</code></b></summary>

```js
// the `response` is everything you would expect to be in a normal response from an http request with the `data` field added.
// ⚠️ The `response` object cannot be destructured! (at least not currently) ️️⚠️
var [request, response, loading, error] = useFetch('https://example.com')

// want to use object destructuring? You can do that too
var {
request,
// the `response` is everything you would expect to be in a normal response from an http request with the `data` field added.
// ⚠️ The `response` object cannot be destructured! (at least not currently) ️️⚠️
response,
loading,
error,
Expand Down Expand Up @@ -226,14 +230,8 @@ var {
query, // GraphQL
abort
} = request

var {
data,
ok,
headers,
...restOfHttpResponse // everything you would get in a response from an http request
} = response
```

</details>


Expand Down Expand Up @@ -576,6 +574,7 @@ Todos
- [ ] tests for SSR
- [ ] tests for FormData (can also do it for react-native at same time. [see here](https://stackoverflow.com/questions/45842088/react-native-mocking-formdata-in-unit-tests))
- [ ] tests for GraphQL hooks `useMutation` + `useQuery`
- [ ] tests for stale `response` see this [PR](https://github.com/alex-cory/use-http/pull/119/files)
- [ ] make this a github package
- [ ] Make work with React Suspense [current example WIP](https://codesandbox.io/s/7ww5950no0)
- [ ] get it all working on a SSR codesandbox, this way we can have api to call locally
Expand Down
11 changes: 4 additions & 7 deletions docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -175,11 +175,15 @@ const App = () => (
Destructured
-------------
```js
// the `response` is everything you would expect to be in a normal response from an http request with the `data` field added.
// ⚠️ The `response` object cannot be destructured! (at least not currently) ️️⚠️
var [request, response, loading, error] = useFetch('https://example.com')

// want to use object destructuring? You can do that too
var {
request,
// the `response` is everything you would expect to be in a normal response from an http request with the `data` field added.
// ⚠️ The `response` object cannot be destructured! (at least not currently) ️️⚠️
response,
loading,
error,
Expand Down Expand Up @@ -209,13 +213,6 @@ var {
query, // GraphQL
abort
} = request

var {
data,
ok,
headers,
...restOfHttpResponse // everything you would get in a response from an http request
} = response
```

Relative routes
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "use-http",
"version": "0.1.90",
"version": "0.1.91",
"homepage": "http://use-http.com",
"main": "dist/index.js",
"license": "MIT",
Expand Down
7 changes: 5 additions & 2 deletions src/useFetch.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,9 @@ import useSSR from 'use-ssr'
import makeRouteAndOptions from './makeRouteAndOptions'
import { isEmpty, invariant } from './utils'

const makeResponseProxy = (res = {}) => new Proxy(res, {
get: (httpResponse: any, key) => (httpResponse.current || {})[key]
})

function useFetch<TData = any>(...args: UseFetchArgs): UseFetch<TData> {
const { customOptions, requestInit, defaults } = useFetchArgs(...args)
Expand Down Expand Up @@ -155,8 +158,8 @@ function useFetch<TData = any>(...args: UseFetchArgs): UseFetch<TData> {
}, [onMount, executeRequest])

return Object.assign<UseFetchArrayReturn<TData>, UseFetchObjectReturn<TData>>(
[request, res.current, loading as boolean, error],
{ request, response: res.current, ...request },
[request, makeResponseProxy(res), loading as boolean, error],
{ request, response: makeResponseProxy(res), ...request },
)
}

Expand Down
3 changes: 2 additions & 1 deletion src/useFetchArgs.ts
Original file line number Diff line number Diff line change
Expand Up @@ -116,10 +116,11 @@ export default function useFetchArgs(
const requestInit = pullOutRequestInit(requestInitOptions)

return {
...useFetchArgsDefaults.requestInit,
...contextRequestInit,
...requestInit,
headers: {
...useFetchArgsDefaults.requestInit.headers,
...defaults.headers,
...contextRequestInit.headers,
...requestInit.headers,
},
Expand Down