@aquelle1/line-and-sinker

import {
    useArray, useFetch, usePromise
} from "@aquelle1/line-and-sinker"

import {
    useOnes, useZeroes
} from "@aquelle1/line-and-sinker/lib/useArray"

Usages:

const [actions, value] = useArray([]);      // state-aware array
const [actions, value] = useOnes(N);        // state-aware single-row multi-dimension array filled with ones
const [actions, value] = useZeroes(N);      // state-aware single-row multi-dimension array filled with zeroes
const [actions, value] = useOnes(N, n);     // state-aware multi-dimension array filled with ones
const [actions, value] = useZeroes(N, n);   // state-aware multi-dimension array filled with zeroes
/*
    actions: {function} = {
      setValue,     // set the internal array
      unshift,
      push,
      clear,
      removeIndex,
      pop,
      shift
    };
    value: array // internal array
*/

const promise = useFetch("route", {             // state-aware fetch query
    fetch: "opts"
})
const promise = usePromise(new Promise(...))    // state-aware promise
/*
    promise = {
        request: function,  // helper to re-evaluate the promise
        data: json | text,  // data received from promise
        isLoading: bool,    // promise still in progress
        error: Error        // promise error was handled
    }
*/

Examples:

import React, {
    useEffect
} from "react"
import {
    useArray, useFetch
} from "@aquelle1/line-and-sinker"

export default () => {
    const {
        data, isLoading, error
    } = useFetch("https://api.myjson.com/bins/yg6te")

    const [{
        setValue: updateArrayValue
    }, arrayValue] = useArray([])

    useEffect(() => {
        if(!isLoading)
            updateArrayValue(data)
    }, [isLoading])

    return (
        <>
            Array value is: {arrayValue}
        </>
    )
}