@devgateway/dvz-ui-react
Version:
A modular, embeddable React component library for data visualization and UI, built with TypeScript. Provides reusable components for charts, maps, dashboards, and more, with built-in support for internationalization and Redux integration.
216 lines (215 loc) • 6.26 kB
JavaScript
import { jsxs as re, jsx as L } from "react/jsx-runtime";
import { useRef as oe, useState as d, useEffect as x } from "react";
import { Container as ae } from "semantic-ui-react";
import { toNumber as le, toBoolean as n } from "../../utils/data.js";
import { getYearRange as ne } from "@devgateway/wp-react-lib";
import q from "./PostsFilterDropdown.js";
import { Config as ie } from "../../conf/index.js";
import { useAppDispatch as se } from "../../redux/hooks.js";
import { useSelector as ce } from "react-redux";
const ye = (m) => {
const {
taxonomy: p,
group: O,
placeholder: l,
allLabel: S,
noneLabel: h,
useSingleColumn: f,
enableTextSearch: b,
filterType: A,
showNoDataOption: F,
closeOnSelect: N,
allNoneSameBehaviour: v,
autoApply: B,
alphabeticalSort: Y,
ascOrder: o,
type: i,
categories: C,
onChange: _
} = m, [T, c] = d([]), g = async () => {
if (!p || p === "none") {
c([]);
return;
}
const e = await (await fetch(ie.REACT_APP_WP_API + "/wp/v2/" + p)).json();
if (e) {
const a = e.map((s) => ({
key: s.id,
value: s.id,
text: s.name
}));
if (C) {
const s = a.filter((w) => C.indexOf(w.value.toString()) > -1);
c(s);
} else
c(a);
}
};
return x(() => (g(), () => {
c([]);
}), [i]), /* @__PURE__ */ L(
q,
{
...m,
group: O,
placeholder: l,
allLabel: S,
noneLabel: h,
useSingleColumn: f,
enableTextSearch: b,
filterType: A,
showNoDataOption: F,
closeOnSelect: N,
allNoneSameBehaviour: v,
autoApply: B,
alphabeticalSort: Y,
ascOrder: o,
options: T,
onChange: _
}
);
}, Ce = (m) => {
const {
"data-alphabetical-sort": p,
"data-asc-order": O,
"data-group": l,
"data-placeholder": S,
"data-all-label": h,
"data-none-label": f,
"data-use-single-column": b,
"data-enable-text-search": A,
"data-filter-type": F,
"data-show-no-data-option": N,
"data-close-on-select": v,
"data-all-none-same-behaviour": B,
"data-auto-apply": Y,
"data-taxonomy": o,
"data-categories": i,
"data-is-country-filter": C,
"data-is-year-filter": _,
"data-type": T,
"data-sort-first-by": c
} = m, g = se(), e = ce((r) => r.getIn(["data", "posts", l])) || {}, a = F === "multi-select", s = oe(0), w = n(p), G = n(O), D = n(N), R = n(v), j = n(B), K = n(Y), t = n(C), y = n(_), k = n(b), $ = n(A), V = c !== "none" ? le(c) : null, [H, J] = d([]), [Q, U] = d(
a ? Array.isArray(e.yearFilter) ? e.yearFilter : e.yearFilter != null ? [e.yearFilter] : [] : e.yearFilter || void 0
), [M, P] = d(
a ? Array.isArray(e.countryFilter) ? e.countryFilter : e.countryFilter != null ? [e.countryFilter] : [] : e.countryFilter || void 0
), [W, E] = d(
a ? Array.isArray(e.categoryFilter) ? e.categoryFilter : e.categoryFilter != null ? [e.categoryFilter] : [] : e.categoryFilter || void 0
);
x(() => {
U(e.yearFilter || void 0), a ? (P(Array.isArray(e.countryFilter) ? e.countryFilter : e.countryFilter != null ? [e.countryFilter] : []), E(Array.isArray(e.categoryFilter) ? e.categoryFilter : e.categoryFilter != null ? [e.categoryFilter] : [])) : (P(e.countryFilter || void 0), E(e.categoryFilter || void 0));
}, [e, a]);
const X = (r) => {
g({
type: "SET_POSTS_FILTER",
group: l,
isYearFilter: y,
yearFilter: r,
isCountryFilter: t,
categoryFilter: e.categoryFilter,
countryFilter: e.countryFilter,
sortFirstBy: V,
countryCategory: o,
categoryTaxonomy: o,
countryTaxonomy: o
});
}, Z = (r) => {
t ? P(r) : E(r), g({
type: "SET_POSTS_FILTER",
group: l,
// Preserve both filters so they can work together
categoryFilter: t ? e.categoryFilter : r,
countryFilter: t ? r : e.countryFilter,
yearFilter: e.yearFilter,
isYearFilter: y,
isCountryFilter: t,
sortFirstBy: t ? V : e.sortFirstBy,
countryCategory: t ? o : e.countryCategory,
categoryCategory: t ? e.categoryCategory : r,
categoryTaxonomy: t ? e.categoryTaxonomy : o,
countryTaxonomy: t ? o : e.countryTaxonomy
});
};
x(() => {
const r = t ? e.categoryFilter : a ? i ? i.split(",").map(Number) : [] : e.categoryFilter, u = t && a ? i ? i.split(",").map(Number) : [] : e.countryFilter;
g({
type: "SET_INITIAL_POSTS_FILTER",
group: l,
categoryFilter: r,
countryFilter: u,
isYearFilter: y,
isCountryFilter: t,
sortFirstBy: V,
categoryCategory: t ? null : e.categoryCategory,
categoryTaxonomy: t ? null : o,
countryCategory: t ? e.countryCategory : null,
countryTaxonomy: t ? o : null
});
}, [l]), x(() => {
y && ee();
}, [y]);
const ee = async () => {
const te = (await ne()).data.map((I) => ({
key: I,
value: I,
text: `Year ${I}`
}));
J(te || []);
};
return /* @__PURE__ */ re(ae, { fluid: !0, className: "filter", children: [
y && /* @__PURE__ */ L(
q,
{
group: l,
placeholder: S,
allLabel: h,
noneLabel: f,
useSingleColumn: k,
enableTextSearch: $,
filterType: F,
showNoDataOption: D,
closeOnSelect: R,
allNoneSameBehaviour: j,
autoApply: K,
alphabeticalSort: w,
ascOrder: G,
options: H,
taxonomy: o,
type: T,
value: Q,
onChange: (r, u) => {
X(u);
},
resetKey: s.current
}
),
!y && /* @__PURE__ */ L(
ye,
{
group: l,
placeholder: S,
allLabel: h,
noneLabel: f,
useSingleColumn: k,
enableTextSearch: $,
filterType: F,
showNoDataOption: D,
closeOnSelect: R,
allNoneSameBehaviour: j,
autoApply: K,
taxonomy: o,
type: T,
value: t ? M : W,
onChange: (r, u) => {
Z(u);
},
categories: i ? i.split(",") : [],
resetKey: s.current
},
`cat-${l}`
)
] });
};
export {
Ce as default
};