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 Request(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 save notification settings to localstorage using uselocalstoragenextjs

//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)
});

useQuery

Hook for handling Query Router

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

const {
    query, // query value, interface useQuery_QueryProps
    setQuery, // set query value
    onChangeQuery, // change one query value by key
    isChange, // boolean if change query
} = useQuery();

Developer

Francisco Blanco

Gitlab franciscoblancojn

Email [e-mail]

Repositories

• Gitlab