@cgarciagarcia/react-query-builder 1.0.0 → 1.3.0

package/README.md

@@ -1 +1,42 @@
-# react-query-builder
+<p><b>JavaScript/TypeScript Query Builder</b> provides a way to build a query string compatible with <a href="https://github.com/spatie/laravel-query-builder">spatie/laravel-query-builder</a>.</p>
+
+## Install
+
+You can install package using yarn (or npm):
+
+```bash
+yarn add @cgarciagarcia/react-qiery-builder
+```
+
+## Usage
+
+This package was thought offer an easy way to interact with backend integration `spatie/laravel-query-builder`
+using your favorite library for frontend `React.js` using a customize hook which you could interact.
+
+### All Example
+
+Here is a simple example:
+
+```js
+import {useQueryBuilder} from "@cgarciagarcia/react-query-builder";
+
+const baseConfig = {
+    aliases: {
+        "frontend_name": "backend_name",
+    }
+}
+
+const builder = useQueryBuilder(baseConfig)
+    .filters("age", 18)
+    .sorts("created_at")// by default sorting asc
+    .sorts("age", 'desc') // sorting desc
+    .includes("posts", "comments")
+
+
+console.log(theQuery.build());
+// /users?filter[age]=18,
+
+
+## License
+
+The MIT License (MIT). Please see [License File](LICENSE.md) for more information.

package/dist/actions/filter.js

@@ -0,0 +1,44 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias, } from "@/utils";
+export var filterAction = function (attribute, value, state) {
+    var _a;
+    var alias = usingAlias(state, attribute);
+    var prevFilter;
+    var allFilters = state.filters.reduce(function (filters, filter) {
+        if (filter.attribute === alias) {
+            prevFilter = filter;
+            return filters;
+        }
+        return __spreadArray(__spreadArray([], filters, true), [filter], false);
+    }, []);
+    var val = Array.isArray(value) ? value : [value];
+    var newState = __assign(__assign({}, state), { filters: __spreadArray(__spreadArray([], allFilters, true), [
+            {
+                attribute: attribute,
+                value: __spreadArray(__spreadArray([], ((_a = prevFilter === null || prevFilter === void 0 ? void 0 : prevFilter.value) !== null && _a !== void 0 ? _a : []), true), val, true),
+            },
+        ], false) });
+    return newState;
+};
+export var clearFilterAction = function (state) {
+    return __assign(__assign({}, state), { filters: [] });
+};

package/dist/actions/include.js

@@ -0,0 +1,23 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+export var includeAction = function (includes, state) {
+    return __assign(__assign({}, state), { includes: __spreadArray(__spreadArray([], state.includes, true), [includes], false) });
+};

package/{src/actions/index.ts → dist/actions/index.js}

@@ -1,5 +1,3 @@
 export * from "@/actions/sort";
 export * from "@/actions/filter";
 export * from "@/actions/include";
-
-export type Actions = "sort" | "filter" | "clear_filter" | "include";

package/dist/actions/sort.js

@@ -0,0 +1,26 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias } from "@/index";
+export var sortAction = function (sorts, state) {
+    var attribute = sorts[0], direction = sorts[1];
+    var attributeAliased = usingAlias(state, attribute);
+    return __assign(__assign({}, state), { sorts: __spreadArray(__spreadArray([], state.sorts, true), [[attributeAliased, direction]], false) });
+};

package/dist/dist/actions/filter.js

@@ -0,0 +1,47 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias, } from "@/utils";
+export var filterAction = function (attribute, value, state) {
+    var _a;
+    var alias = usingAlias(state, attribute);
+    var prevFilter;
+    var allFilters = state.filters.reduce(function (filters, filter) {
+        if (filter.attribute === alias) {
+            prevFilter = filter;
+            return filters;
+        }
+        return __spreadArray(__spreadArray([], filters, true), [filter], false);
+    }, []);
+    var val = Array.isArray(value) ? value : [value];
+    var newState = __assign(__assign({}, state), { filters: __spreadArray(__spreadArray([], allFilters, true), [
+            {
+                attribute: attribute,
+                value: __spreadArray(__spreadArray([], ((_a = prevFilter === null || prevFilter === void 0 ? void 0 : prevFilter.value) !== null && _a !== void 0 ? _a : []), true), val, true),
+            },
+        ], false) });
+    return newState;
+};
+export var clearFilterAction = function (state) {
+    return __assign(__assign({}, state), { filters: [] });
+};

package/dist/dist/actions/include.js

@@ -0,0 +1,26 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+export var includeAction = function (includes, state) {
+    return __assign(__assign({}, state), { includes: __spreadArray(__spreadArray([], state.includes, true), [includes], false) });
+};

package/dist/dist/actions/index.js

@@ -0,0 +1,3 @@
+export * from "@/actions/sort";
+export * from "@/actions/filter";
+export * from "@/actions/include";

package/dist/dist/actions/sort.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias } from "@/index";
+export var sortAction = function (sorts, state) {
+    var attribute = sorts[0], direction = sorts[1];
+    var attributeAliased = usingAlias(state, attribute);
+    return __assign(__assign({}, state), { sorts: __spreadArray(__spreadArray([], state.sorts, true), [[attributeAliased, direction]], false) });
+};

package/dist/dist/dist/actions/filter.js

@@ -0,0 +1,47 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias, } from "@/utils";
+export var filterAction = function (attribute, value, state) {
+    var _a;
+    var alias = usingAlias(state, attribute);
+    var prevFilter;
+    var allFilters = state.filters.reduce(function (filters, filter) {
+        if (filter.attribute === alias) {
+            prevFilter = filter;
+            return filters;
+        }
+        return __spreadArray(__spreadArray([], filters, true), [filter], false);
+    }, []);
+    var val = Array.isArray(value) ? value : [value];
+    var newState = __assign(__assign({}, state), { filters: __spreadArray(__spreadArray([], allFilters, true), [
+            {
+                attribute: attribute,
+                value: __spreadArray(__spreadArray([], ((_a = prevFilter === null || prevFilter === void 0 ? void 0 : prevFilter.value) !== null && _a !== void 0 ? _a : []), true), val, true),
+            },
+        ], false) });
+    return newState;
+};
+export var clearFilterAction = function (state) {
+    return __assign(__assign({}, state), { filters: [] });
+};

package/dist/dist/dist/actions/include.js

@@ -0,0 +1,26 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+export var includeAction = function (includes, state) {
+    return __assign(__assign({}, state), { includes: __spreadArray(__spreadArray([], state.includes, true), [includes], false) });
+};

package/dist/dist/dist/actions/index.js

@@ -0,0 +1,3 @@
+export * from "@/actions/sort";
+export * from "@/actions/filter";
+export * from "@/actions/include";

package/dist/dist/dist/actions/sort.js

@@ -0,0 +1,29 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2)
+        for (var i = 0, l = from.length, ar; i < l; i++) {
+            if (ar || !(i in from)) {
+                if (!ar)
+                    ar = Array.prototype.slice.call(from, 0, i);
+                ar[i] = from[i];
+            }
+        }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { usingAlias } from "@/index";
+export var sortAction = function (sorts, state) {
+    var attribute = sorts[0], direction = sorts[1];
+    var attributeAliased = usingAlias(state, attribute);
+    return __assign(__assign({}, state), { sorts: __spreadArray(__spreadArray([], state.sorts, true), [[attributeAliased, direction]], false) });
+};

package/dist/dist/dist/useQueryBuilder.js

@@ -0,0 +1,86 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { useReducer, useState } from "react";
+import { build, clearFilterAction, filterAction, includeAction, sortAction, } from "@/index";
+var reducer = function (state, action) {
+    switch (action === null || action === void 0 ? void 0 : action.type) {
+        case "filter": {
+            var filter = action.payload;
+            return filterAction(filter.attribute, filter.value, state);
+        }
+        case "clear_filter": {
+            return clearFilterAction(state);
+        }
+        case "include": {
+            var includes = action.payload;
+            return includeAction(includes, state);
+        }
+        case "sort": {
+            var sorts = action.payload;
+            return sortAction(sorts, state);
+        }
+        default: {
+            return __assign({}, state);
+        }
+    }
+};
+var initialState = function () {
+    return ({
+        aliases: {},
+        filters: [],
+        includes: [],
+        sorts: [],
+    });
+};
+export var useQueryBuilder = function (config) {
+    if (config === void 0) {
+        config = {};
+    }
+    var init = useState(function () { return initialState(); })[0];
+    var _a = useReducer(reducer, init, function (init) {
+        var _a;
+        return (__assign(__assign({}, init), { aliases: (_a = config === null || config === void 0 ? void 0 : config.aliases) !== null && _a !== void 0 ? _a : {} }));
+    }), state = _a[0], dispatch = _a[1];
+    var builder = {
+        filters: function (attribute, value) {
+            dispatch({
+                type: "filter",
+                payload: { attribute: attribute, value: value },
+            });
+            return builder;
+        },
+        build: function () { return build(state); },
+        clearFilters: function () {
+            dispatch({
+                type: "clear_filter",
+                payload: undefined,
+            });
+            return builder;
+        },
+        includes: function (includes) {
+            dispatch({
+                type: "include",
+                payload: includes,
+            });
+            return builder;
+        },
+        sorts: function (attribute, direction) {
+            dispatch({
+                type: "sort",
+                payload: [attribute, direction !== null && direction !== void 0 ? direction : "asc"],
+            });
+            return builder;
+        },
+    };
+    return builder;
+};

package/dist/dist/dist/utils/alias.js

@@ -0,0 +1,4 @@
+export var usingAlias = function (state, key) {
+    var _a;
+    return (_a = state.aliases[key]) !== null && _a !== void 0 ? _a : key;
+};

package/dist/dist/dist/utils/build.js

@@ -0,0 +1,30 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+export var build = function (state) {
+    var filters = state.filters.reduce(function (acc, filter) {
+        var _a;
+        return (__assign(__assign({}, acc), (_a = {}, _a["filters[".concat(filter.attribute, "]")] = filter.value.join(","), _a)));
+    }, {});
+    var sorts = state.sorts.reduce(function (acc, sort) {
+        var attribute = sort[0], dir = sort[1];
+        var direction = dir === "desc" ? "-" : "";
+        acc.push("".concat(direction).concat(attribute));
+        return acc;
+    }, []);
+    var urlSearchParams = new URLSearchParams(__assign({}, filters));
+    if (sorts.length > 0) {
+        urlSearchParams.append("sort", sorts.join(","));
+    }
+    var searchParamsString = urlSearchParams.toString();
+    return searchParamsString ? "?" + urlSearchParams.toString() : "";
+};

package/dist/dist/dist/utils/state.js

@@ -0,0 +1 @@
+export {};

package/dist/dist/index.js

@@ -0,0 +1,3 @@
+export * from "@/utils";
+export * from "@/actions";
+export * from "@/useQueryBuilder";

package/dist/dist/useQueryBuilder.js

@@ -0,0 +1,86 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { useReducer, useState } from "react";
+import { build, clearFilterAction, filterAction, includeAction, sortAction, } from "@/index";
+var reducer = function (state, action) {
+    switch (action === null || action === void 0 ? void 0 : action.type) {
+        case "filter": {
+            var filter = action.payload;
+            return filterAction(filter.attribute, filter.value, state);
+        }
+        case "clear_filter": {
+            return clearFilterAction(state);
+        }
+        case "include": {
+            var includes = action.payload;
+            return includeAction(includes, state);
+        }
+        case "sort": {
+            var sorts = action.payload;
+            return sortAction(sorts, state);
+        }
+        default: {
+            return __assign({}, state);
+        }
+    }
+};
+var initialState = function () {
+    return ({
+        aliases: {},
+        filters: [],
+        includes: [],
+        sorts: [],
+    });
+};
+export var useQueryBuilder = function (config) {
+    if (config === void 0) {
+        config = {};
+    }
+    var init = useState(function () { return initialState(); })[0];
+    var _a = useReducer(reducer, init, function (init) {
+        var _a;
+        return (__assign(__assign({}, init), { aliases: (_a = config === null || config === void 0 ? void 0 : config.aliases) !== null && _a !== void 0 ? _a : {} }));
+    }), state = _a[0], dispatch = _a[1];
+    var builder = {
+        filters: function (attribute, value) {
+            dispatch({
+                type: "filter",
+                payload: { attribute: attribute, value: value },
+            });
+            return builder;
+        },
+        build: function () { return build(state); },
+        clearFilters: function () {
+            dispatch({
+                type: "clear_filter",
+                payload: undefined,
+            });
+            return builder;
+        },
+        includes: function (includes) {
+            dispatch({
+                type: "include",
+                payload: includes,
+            });
+            return builder;
+        },
+        sorts: function (attribute, direction) {
+            dispatch({
+                type: "sort",
+                payload: [attribute, direction !== null && direction !== void 0 ? direction : "asc"],
+            });
+            return builder;
+        },
+    };
+    return builder;
+};

package/dist/dist/utils/alias.js

@@ -0,0 +1,4 @@
+export var usingAlias = function (state, key) {
+    var _a;
+    return (_a = state.aliases[key]) !== null && _a !== void 0 ? _a : key;
+};

package/dist/dist/utils/build.js

@@ -0,0 +1,30 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function (t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s)
+                if (Object.prototype.hasOwnProperty.call(s, p))
+                    t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+export var build = function (state) {
+    var filters = state.filters.reduce(function (acc, filter) {
+        var _a;
+        return (__assign(__assign({}, acc), (_a = {}, _a["filters[".concat(filter.attribute, "]")] = filter.value.join(","), _a)));
+    }, {});
+    var sorts = state.sorts.reduce(function (acc, sort) {
+        var attribute = sort[0], dir = sort[1];
+        var direction = dir === "desc" ? "-" : "";
+        acc.push("".concat(direction).concat(attribute));
+        return acc;
+    }, []);
+    var urlSearchParams = new URLSearchParams(__assign({}, filters));
+    if (sorts.length > 0) {
+        urlSearchParams.append("sort", sorts.join(","));
+    }
+    var searchParamsString = urlSearchParams.toString();
+    return searchParamsString ? "?" + urlSearchParams.toString() : "";
+};

package/dist/dist/utils/index.js

@@ -0,0 +1,3 @@
+export * from "@/utils/state";
+export * from "@/utils/alias";
+export * from "@/utils/build";

package/dist/dist/utils/state.js

@@ -0,0 +1 @@
+export {};

package/dist/index.js

@@ -0,0 +1,3 @@
+export * from "@/utils";
+export * from "@/actions";
+export * from "@/useQueryBuilder";