zim-fuzzysearch/lib/components/hooks/usePagination.js

Client side fuzzy search combined with seperate configurable result highlighting.

import React from "react";
/**
 * Takes in an array to be indexed in page chunks. Returns indexed page chunk and
 * methods to navigate according through the indexed page chunks.
 * @param toIndex Array to be indexed
 * @param pageLen Length of page. Measured in count of things in given toIndex array.
 *
 * */
export var usePagination = function (toIndex, pageLen) {
    if (pageLen === void 0) { pageLen = 5; }
    var _a = React.useState(null), pageTuples = _a[0], setPageTuples = _a[1];
    var _b = React.useState(0), curPageTupleInd = _b[0], setCurPageTupleInd = _b[1];
    //generate page indexes
    React.useEffect(function () {
        if (!toIndex)
            return;
        var indices = indexPageTuples(toIndex, pageLen);
        // makes sure that when no indices found -> reset result.
        if (indices.length === 0) {
            setPageTuples(null);
            setCurPageTupleInd(0);
            return;
        }
        setPageTuples(function () { return indices; });
    }, [JSON.stringify(toIndex)]);
    /**
     * Returns the current active page-chunk as any[].
     */
    var getPageSection = function () {
        if (!toIndex)
            throw new ReferenceError("toIndex is undefined. Cannot get the section of an undefined array. ");
        var activeTuple = getCurPageTuple();
        return toIndex.slice(activeTuple[0], activeTuple[1]);
    };
    /**
     * @returns The current active tuple index of the indexed array.
     */
    var getCurPageTuple = function () {
        if (!pageTuples)
            throw new ReferenceError("Array is not indexed yet. Make sure to call getCurPageTuple only when the pageTuples are already defined.");
        return pageTuples[curPageTupleInd];
    };
    /**
     * Activates the next page chunk.
     */
    var nextPage = function () {
        if (!pageTuples)
            return;
        if (curPageTupleInd === pageTuples.length - 1)
            return;
        return setCurPageTupleInd(curPageTupleInd + 1);
    };
    /**
     * Activates previous page chunk
     */
    var prevPage = function () {
        if (!pageTuples)
            return;
        if (curPageTupleInd === 0)
            return;
        return setCurPageTupleInd(curPageTupleInd - 1);
    };
    /**
     * Activates given page chunk number.
     * @param tupleInd number of page to be activated
     */
    var goToPage = function (tupleInd) {
        if (!pageTuples)
            return;
        setCurPageTupleInd(tupleInd);
    };
    /**
     * Checks if given tuple is not same by reference but by value.
     * Returns true only if same by value.
     * @param a first tuple to compare
     * @param b second tuple to compare
     */
    var compareTuples = function (a, b) {
        return (Array.isArray(a) &&
            Array.isArray(b) &&
            a.length === b.length &&
            a.every(function (val, index) { return val === b[index]; }));
    };
    /**
     * Returns the index of the first tuple that is same by value (not reference).
     * @param tuples Array of tuples to be searched.
     * @param aTuple tuple to be found in given array.
     */
    var findSameTuple = function (tuples, aTuple) {
        var ind = -1;
        tuples.forEach(function (tuple, i) {
            if (compareTuples(tuple, aTuple))
                return (ind = i);
        });
        return ind;
    };
    /**
     * Returns an tuple array as index for pagination according to given array.
     * The first tuple value represents the start and the second the end of the currently indexed page.
     * E.g. [[0,5],[5,10],[10,12]].
     * @param arr array to represented as tuple array.
     * @param pageSize "span-value" of first and second entry of tuple. 5 will e.g. generate [15,20] or [0,5]
     * @returns Array of tuples.
     */
    var indexPageTuples = function (arr, pageSize) {
        if (pageSize === void 0) { pageSize = 10; }
        var modulo = arr.length % pageSize;
        var keyNum = arr.length;
        var last = 0;
        var tuples = [];
        for (var i = pageSize; i <= keyNum; i += pageSize) {
            tuples.push([last, i]);
            last = i;
        }
        // when uneven need to push rest also
        if (modulo !== 0)
            tuples.push([last, last + modulo]);
        return tuples;
    };
    return {
        nextPage: nextPage,
        prevPage: prevPage,
        goToPage: goToPage,
        getPageSection: getPageSection,
        pageTuples: pageTuples,
        // more intern methods
        compareTuples: compareTuples,
        findSameTuple: findSameTuple,
        indexPageTuples: indexPageTuples,
        curPageTupleInd: curPageTupleInd,
        getCurPageTuple: getCurPageTuple,
    };
};