fenextjs-hook

fenextjs-hook

Hook of Fenextjs

useData

Hook for handling Data Object

//for CJS
import { useData } from "fenextjs-hook/cjs/useData";
//for ESM
import { useData } from "fenextjs-hook/esm/useData";

//interface of value
interface ValueProps {
    //....
}
//interface of value Memo(optional)
interface ValueMemoProps {
    //....
}
const {
    data, // value
    onChangeData, // change one value by key
    isChange, // boolean if change data
    setData, // set value
    dataMemo, // data parse by onMemo
    setIsChange, // set isChange
} = useData<
    ValueProps, // intefate of value
    ValueMemoProps //interface of value Memo(optional)
>(
    defaultValue, // default value
    {
        //function execute after change value
        onChangeDataAfter: (data: ValueProps) => {

        },
        //function execute for parse data to dataMemo
        onMemo: (data: ValueProps) => {
            const dataMemo : ValueMemoProps = {
                //...
            }
            return dataMemo
        };
    }
);

useRequest

Hook for request, loader and errors, with query and autoRequest

//for CJS
import { useRequest } from "fenextjs-hook/cjs/useRequest";
//for ESM
import { useRequest } from "fenextjs-hook/esm/useRequest";

//interface of query
interface QueryProps {
    //....
}
//interface of result
interface ResultProps {
    //....
}
//interface of error
interface ErrorProps {
    //....
}
const {
        result, // result of request,
        loader, // boolean of loader,
        error, // error failing the request
        onRequest, // function request,
    } = useRequest < QueryProps, // intefate of query
    ResultProps; //interface of result
ErrorProps > //interface of error Memo(optional)
    {
        query, // query by use in request
        request, // function request
        autoRequest, // boolean if auto execute request is change query (optional)(default = false)
    };

useModal

Hook to save modal settings to localstorage using uselocalstoragenextjs

//for CJS
import { useModal } from "fenextjs-hook/cjs/useModal";
//for ESM
import { useModal } from "fenextjs-hook/esm/useModal";

//inteface of content valueModal
interface useModalConfigContentProps {
    key: string; // key of config modal
    data: any; // config modal
}
//inteface of valueModal
interface useModalConfigProps {
    active?: boolean; // if active modal
    use?: boolean; // if use modal in current page
    loader?: boolean; // if loader modal
    content?: useModalConfigContentProps[]; // content config modal
}

const {
    valueModal, // value of config modal, inteface useModalConfigProps
    loadModal, // boolean if load modal
    updateModal, // update one value of config modal by key
    setModal, // set value of config modal, inteface useModalConfigProps
} = useModal();

useNotification

Hook to show or remove notifications

//for CJS
import { useNotification } from "fenextjs-hook/cjs/useNotification";
//for ESM
import { useNotification } from "fenextjs-hook/esm/useNotification";

//type of notification
type NotificationType = "none" | "normal" | "ok" | "error" | "warning";

//iterfate of notification
interface NotificationProps {
    type?: NotificationType;
    message: string;
}
const {
    loadNotification, // boolean if load notification,
    notification, // value of notification, interface NotificationProps
    pop, // function of add notification by time
    reset, // reset notification (remove)
} = useNotification({
    time: 2000, // time of show notification (optional)(default = 2000)
});

Developer

Francisco Blanco

Gitlab franciscoblancojn

Email [e-mail]

Repositories

• Gitlab