Gathering detailed insights and metrics for @app-elements/use-request
Gathering detailed insights and metrics for @app-elements/use-request
Installations
npm install @app-elements/use-requestDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
14.5.0
NPM Version
lerna/3.22.1/node@v14.5.0+x64 (darwin)
Releases
Unable to fetch releases
Languages
2
JavaScript
Less
JavaScript (84.43%)
Less (15.57%)
Developer
inputlogic
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
543 Commits
12 Watchers
20 Branches
20 Contributors
Updated on Sep 02, 2022
Maintainers
4
Package Meta Information
Latest Version
2.1.4
Package Id
@app-elements/use-request@2.1.4
Unpacked Size
249.83 kB
Size
57.47 kB
File Count
15
NPM Version
lerna/3.22.1/node@v14.5.0+x64 (darwin)
Node Version
14.5.0
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
useRequest
useRequest is a simple hook for loading data. It's efficient and caches results automatically.
Installation
npm install --save @app-elements/use-request
Usage
1import { useRequest } from '@app-elements/use-request' 2import createStore from 'atom' 3 4const store = createStore([], {}) 5 6const Users = () => { 7 // return an object with the keys: result, clear 8 // result is the JSON response from the given URL. 9 // clear is a function to clear the cache, and reload the data from the URL. 10 const { result, error, isLoading, clear } = useRequest(store, 'https://jsonplaceholder.typicode.com/users') 11 if (isLoading) { 12 return <div>Loading...</div> 13 } 14 if (error != null) { 15 return <div>Error!</div> 16 } 17 return ( 18 <ul> 19 {result.map(({ name }) => <li>{name}</li>)} 20 </ul> 21 ) 22}
Dependent Fetching
Sometimes you need to load a request based on data from another request. Here's how you can orchestrate that:
1const { result: user } = useRequest(store, '/api/user') 2const { result: projects } = useRequest(store, user != null ? `/api/user/${user.id}/projects` : null)
Making a Request Without Hooks
The core request function that useRequest utilizes comes with some nice defaults that you may want to reuse outside of a hook context:
- Sets auth headers by default
- Uses your configured
apiUrl - Safely parses server response
- Unlike Fetch, the promise fails if the status code is
>= 400
1import { request } from '@app-elements/use-request/request' 2 3const { promise, xhr } = request({ 4 url: 'https://my-cool-api.com/resource', 5 method: 'POST', 6 data: { 7 // ... 8 } 9})
Request Reducer
useRequest also ships with an optional reducer and actions that help with
managing the cached request results. To use it, you must import the reducer and include it when creating your store.
1import { requestsReducer, actions as requestActions } from '@app-elements/use-request/reducer' 2 3const store = createStore([requestsReducer], initialState) 4 5// It's also convenient to export the actions from your store file: 6export const clearRequest = requestActions.clearRequest 7export const clearRequests = requestActions.clearRequests 8export const patchListRequest = requestActions.patchListRequest
appendRequest
appendRequest({ endpointOrUid: String, item: Object, path?: String }): FluxStandardAction
This is for appending a new item for an endpoint that represents an array of items to render, ex. api/listings. Say, you create a new listing, instead of getting the whole listing array from your API again, you can just append the new listing to the end of the existing array of items you have.
1appendRequest({ 2 endpointOrUid: '/users', 3 path: '', 4 item: { id: 6, name: 'Margo' } 5})
clearRequest
clearRequest(endpointOrUid: String): FluxStandardAction
Removes the matching endpointOrUid from the requests object.
1clearRequest('/api/listings')
clearRequests
clearRequests(predicate: Function): FluxStandardAction
Filters out any endpointOrUids on the requests object that match the predicate function.
1clearRequests(uid => uid.indexOf('listings') > -1)
patchListRequest
patchListRequest({ endpointOrUid: String, dataToMerge: Object, matchKey?: String, path?: String }): FluxStandardAction
This is for patching an endpoint that represents an array of items to render, ex. api/listings. Let's say you are rendering this array of items, and then perform an update to one of the items contained in that array. When you go back to view the list, it very likely contains that one item but with outdated data. You could clear the entire listings request, re-rendering the whole list, but it would be much nicer to just update the one item in the listings that we know has updated. This way, the entire list isn't re-rendered, rather only the one item.
1patchListRequest({ 2 endpointOrUid: '/api/listings', 3 dataToMerge: { id: 4, title: 'Updated title' }, // Must include the `matchKey` value. In this case, `id: 4`. 4 matchKey = 'id', // Optional, defaults to 'id'. 5 path = 'results' // Optional, defaults to 'results'. This matches the response shape of Django-Rest-Framework. It should be the path to the actual array data returned in the API response. 6})
Props
| Prop | Type | Default | Description |
|---|---|---|---|
store | Object | None | An (atom) store instance |
url | String | None | A URL to GET data from |
options | Object | None | Various options to customize your request |
Request Options
| Prop | Type | Default | Description |
|---|---|---|---|
maxTime | Number | 30000 | Time (ms) to cache result |
uid | String | None | A unique ID to store cached result under |
headers | Object | None | Your request headers |
method | String | None | Request method |
data | Object | None | Data to send. Typically with POST or PATCH requests |
noAuth | Boolean | false | Skip automatically setting the Authorization header |
contentType | String | 'application/json' | Set the Content-Type, or falsy for no Content-Type header |
Return values
| Prop | Type | Description |
|---|---|---|
result | JSON | The body returned by the request. Could be null, or a string if not a JSON endpoint. |
error | Error | If the response header is >= 400, this will contain an Error instance. |
isLoading | Boolean | true until either result or error is set. |
clear | Function | Call this to clear the cached result of the request. |
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
Found 1/26 approved changesets -- score normalized to 0
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
license file not detected
Details
- Warn: project does not have a license file
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 7 are checked with a SAST tool
Reason
71 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-h5c3-5r3r-rr8q
- Warn: Project is vulnerable to: GHSA-rmvr-2pp2-xj38
- Warn: Project is vulnerable to: GHSA-xx4v-prfh-6cgc
- Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5
- Warn: Project is vulnerable to: GHSA-257v-vj4p-3w2h
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm
- Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6
- Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44
- Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988
- Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
- Warn: Project is vulnerable to: GHSA-rc47-6667-2j5j
- Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr
- Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g
- Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-3j8f-xvm3-ffx4
- Warn: Project is vulnerable to: GHSA-4p35-cfcx-8653
- Warn: Project is vulnerable to: GHSA-7f3x-x4pr-wqhj
- Warn: Project is vulnerable to: GHSA-jpp7-7chh-cf67
- Warn: Project is vulnerable to: GHSA-q6wq-5p59-983w
- Warn: Project is vulnerable to: GHSA-j9fq-vwqv-2fm2
- Warn: Project is vulnerable to: GHSA-pqw5-jmp5-px4v
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-566m-qj78-rww5
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-hwj9-h5mp-3pm3
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94
- Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq
- Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9
- Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw
- Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc
- Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
- Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-38fc-wpqx-33j7
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
Score
1.5
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More