react-hooks-toolbox
Collection of Hooks.
Install
Note: React 16.8+ is required for Hooks.
With npm
npm i react-hooks-toolbox
Or with yarn
yarn add react-hooks-toolbox
Run samples
- Clone repository
yarn install
ornpm install
- (This is only necessary for the examples with Axios) Install json-server
npm i json-server
oryarn add global json-server
(Get a full fake REST API with zero coding in less than 30 seconds (seriously)) yarn run run:server
yarn run start
API
Hooks
Axios-API
useAxiosGet()
GET
request
Arguments
url: string
: The request URL.axiosInsance: axios
: (OPTIONAL) The custom axios instance.options: object
: (OPTIONAL) Config option of axios.delay: number
: (OPTIONAL) Request delay.successCb: function
: (OPTIONAL) Callback triggered when the request was successfully executed.failedCb: function
: (OPTIONAL) Callback triggered when the request returned an error.onlyDispathcIf: bool
: (OPTIONAL) Only the request is dispatched when this property istrue
controlledFetch: bool
: (OPTIONAL) This property causes the request to run only when thedispatchFetch
function is called
Returns
Object containing:
status: string
: Request status.response: object
: Request response.error: object
: Request error.dispatchFetch: function
: Dispatched request ifcontrolledFetch
property istrue
.
Example
; const ListPosts = { const status response = ; ......};
useAxiosPost()
POST
request
Arguments
url: string
: The request URL.axiosInsance: axios
: (OPTIONAL) The custom axios instance.options: object
: (OPTIONAL) Config option of axios.delay: number
: (OPTIONAL) Request delay.successCb: function
: (OPTIONAL) Callback triggered when the request was successfully executed.failedCb: function
: (OPTIONAL) Callback triggered when the request returned an error.onlyDispathcIf: bool
: (OPTIONAL) Only the request is dispatched when this property istrue
controlledFetch: bool
: (OPTIONAL) This property causes the request to run only when thedispatchFetch
function is called
Returns
Object containing:
status: string
: Request status.response: object
:` Request response.error: object
: Request error.dispatchFetch: function
: Dispatched request ifcontrolledFetch
property istrue
.
Example
; const AddPost = { const title setTitle = ; const author setAuthor = ; const status response dispatchFetch = ; return <div> <input value=title onChange= /> <input value=author onChange= /> <button onClick= >Add Post</button> </div> ;};
Google-API
useGoogleApiInit()
This Hook is designed for load https://apis.google.com/js/api.js, initialize Google API and handle sign status.
Arguments
initConf: object
: object for Initialize the gapi.client.init(args).
Returns
Object containing:
gapiStatus: string
:init
This status determines when is safe to use windows["gapi"] and gapi is initialized.gapiError: object | string
:null
The errors thrown.signed: boolean
:false
Sign status.userProfile: object
:null
User's basic profile information and token.
DYMO-API
useDymoCheckService()
Return the status of DYMO Label Web Service
Arguments
port: number
:(OPTIONAL) The port of running DYMO Label Web Service.
Returns
status: string
:"init"
:"init" | "loading" | "success" | "error"
Status of DYMO Label Web Service.
useDymoFetchPrinters()
Returns the available DYMO Labelwriter Printer
Arguments
statusDymoService: string
: The status of DYMO Label Web Service.modelPrinter: string
: The model of label writer printer.port: number
: The port of running DYMO Label Web Service.
Returns
Object containing:
statusDymoFetchPrinters: string
:"init"
:"init" | "loading" | "success" | "error"
Status of loading printers.printers: array
:[]
The list of available DYMO Printer.
useDymoOpenLabel()
Render Label
Arguments
statusDymoService: string
: The status of DYMO Label Web Service.labelXML: xml file
: XML file.port: number
:(OPTIONAL) The port of running DYMO Label Web Service.
Returns
Object containing:
label
statusOpenLabel: string
:"init"
:"init" | "loading" | "success" | "error"
Status of render label.errorOpenLabel
Example
; const DymoLabelPreview = { const statusDymoService = ; const label statusOpenLabel errorOpenLabel = ; if label return <img src="data:image/png;base64," + label alt="dymo label preview" /> ; else return null; };