@logora/debate 0.4.80 → 0.4.82

package/dist/components/list/paginated_list/PaginatedList.js

@@ -14,9 +14,9 @@ import { uniqueBy as x } from "../../util/unique_by/uniqueBy.js";
 import { Pagination as Ze } from "../pagination/Pagination.js";
 import { StandardErrorBoundary as He } from "../../error/standard_error_boundary/StandardErrorBoundary.js";
 const ct = ({
-  query: N,
+  query: b,
   sortOptions: o,
-  sort: b,
+  sort: w,
   filters: m,
   tagList: ne,
   pinnedTagList: ae,
@@ -28,8 +28,8 @@ const ct = ({
   perPageParam: ie = "per_page",
   pageParam: oe = "page",
   sortParam: me = "sort",
-  queryParam: de = "query",
-  tagParam: re = "tag_id",
+  queryParam: re = "query",
+  tagParam: de = "tag_id",
   totalHeaderParam: D = "total",
   onUpdateTotal: $,
   onElementsLoad: R,
@@ -51,31 +51,29 @@ const ct = ({
   withPagination: Se = !0,
   numberElements: X,
   countless: ye,
-  onElementClick: we,
-  withUrlParams: Ne = !1,
+  onElementClick: Ne,
+  withUrlParams: be = !1,
   onLoadNewPage: Y
 }) => {
-  const J = We(), t = Pe(), Z = Ve(), H = ze(), { isMobile: K, isTablet: be, isDesktop: L } = Xe(), d = new URLSearchParams(
-    typeof window < "u" ? window.location.search : H.search
-  ), [k, E] = c(!1), [Me, Re] = c(!1), [r, y] = Ye(a, []), [O, ke] = c(
-    r?.length || 0
-  ), [h, j] = c(M || 1), [w, B] = c(N || null), [C, q] = c(
-    d.get("tagId") ? Number.parseInt(d.get("tagId"), 10) : null
-  ), [Ce, ee] = c(null), Te = () => o && o[0].type === "sort" && o[0].value || b || "", Fe = () => {
+  const J = We(), t = Pe(), Z = Ve(), H = ze(), { isMobile: K, isTablet: we, isDesktop: L } = Xe(), r = new URLSearchParams(H.search), [k, E] = c(!1), [Me, Re] = c(!1), [d, y] = Ye(a, []), [O, ke] = c(
+    d?.length || 0
+  ), [h, j] = c(M || 1), [N, B] = c(b || null), [C, q] = c(
+    r.get("tagId") ? Number.parseInt(r.get("tagId"), 10) : null
+  ), [Ce, ee] = c(null), Te = () => o && o[0].type === "sort" && o[0].value || w || "", Fe = () => {
     let e = {};
     return o && o[0].type === "filter" && (e[o[0].name] = o[0].value), m && (e = Object.assign({}, e, m)), e;
   }, [T, F] = c(Te()), [Q, _] = c(Fe()), te = Ue(m);
-  M && M !== h && j(M), N !== void 0 && N !== w && B(N), b !== void 0 && b !== T && F(b), te && JSON.stringify(m) !== JSON.stringify(te) && JSON.stringify(m) !== JSON.stringify(Q) && _(m), p(() => {
-    if (d.get("tagId") && q(Number.parseInt(d.get("tagId"))), d.get("search") && B(d.get("search")), d.get("sort")) {
-      F(d.get("sort"));
-      for (const e of d.values()) {
+  M && M !== h && j(M), b !== void 0 && b !== N && B(b), w !== void 0 && w !== T && F(w), te && JSON.stringify(m) !== JSON.stringify(te) && JSON.stringify(m) !== JSON.stringify(Q) && _(m), p(() => {
+    if (r.get("tagId") && q(Number.parseInt(r.get("tagId"))), r.get("search") && B(r.get("search")), r.get("sort")) {
+      F(r.get("sort"));
+      for (const e of r.values()) {
         o?.map((s) => {
           s.value === e && ee(s.name);
         });
         break;
       }
     }
-    for (const e of d.keys()) {
+    for (const e of r.keys()) {
       o?.map((s) => {
         s.name === e && (_({
           ...m,
@@ -89,7 +87,7 @@ const ct = ({
   }, [
     T,
     Q,
-    w,
+    N,
     A,
     C,
     v
@@ -106,24 +104,24 @@ const ct = ({
       const e = t.updateElements[a];
       if (e.length > 0) {
         const s = e.filter(
-          (i) => r.some((n) => n.id === i.id)
+          (i) => d.some((n) => n.id === i.id)
         );
         if (s.length > 0) {
           De(s);
           const i = e.filter(
-            (f) => !r.some((g) => g.id === f.id)
+            (f) => !d.some((g) => g.id === f.id)
           ), n = { ...t.updateElements };
           i.length > 0 ? n[a] = i : delete n[a], t.setUpdateElements(n);
         }
       }
     }
-  }, [t.updateElements, r]), p(() => {
-    if (t.removeElements && a in t.removeElements && t.removeElements[a].length > 0 && r.length > 0) {
+  }, [t.updateElements, d]), p(() => {
+    if (t.removeElements && a in t.removeElements && t.removeElements[a].length > 0 && d.length > 0) {
       Je(t.removeElements[a]);
       const e = { ...t.removeElements };
       delete e[a], t.setRemoveElements(e);
     }
-  }, [t.removeElements, r]);
+  }, [t.removeElements, d]);
   const _e = (e) => {
     e.type === "filter" ? (F(""), _({
       ...m,
@@ -137,11 +135,11 @@ const ct = ({
       const i = {
         [oe]: e,
         [ie]: v,
-        ...T && !w && { [me]: T },
-        ...w && { [de]: w },
+        ...T && !N && { [me]: T },
+        ...N && { [re]: N },
         ...ye === !0 && { countless: !0 },
         ...Q,
-        ...C && { [re]: C }
+        ...C && { [de]: C }
       };
       s(A, i).then((n) => {
         const f = n.headers;
@@ -169,7 +167,7 @@ const ct = ({
       ), x(i, S || "id");
     });
   }, Je = (e) => {
-    const s = e.map((n) => n.id), i = r.filter(
+    const s = e.map((n) => n.id), i = d.filter(
       (n) => s.indexOf(n.id) === -1
     );
     y(x(i, S || "id"));
@@ -182,7 +180,7 @@ const ct = ({
     {
       className: l.paginatedListItem,
       "data-testid": "list-item",
-      onClick: we,
+      onClick: Ne,
       children: /* @__PURE__ */ u(He, { hideMessage: !0, children: Ie.cloneElement(fe, {
         index: s,
         [ce]: e
@@ -213,10 +211,10 @@ const ct = ({
         onSearch: (e) => B(e),
         onSortChange: _e,
         onTagChange: (e) => q(e),
-        withUrlParams: Ne
+        withUrlParams: be
       }
     ),
-    !k && r.length === 0 ? z ? /* @__PURE__ */ u("div", { className: l.emptyListElement, children: z }) : /* @__PURE__ */ u("div", { className: l.emptyList, children: G || J.formatMessage({
+    !k && d.length === 0 ? z ? /* @__PURE__ */ u("div", { className: l.emptyListElement, children: z }) : /* @__PURE__ */ u("div", { className: l.emptyList, children: G || J.formatMessage({
       id: "info.emptyList",
       defaultMessage: "No items for now."
     }) }) : /* @__PURE__ */ U(Qe, { children: [
@@ -231,12 +229,12 @@ const ct = ({
             [l.oneElementPerLine]: V === 1,
             [l.indexLayoutList]: pe,
             [l.listIsDesktop]: L,
-            [l.listIsTablet]: be && !L,
+            [l.listIsTablet]: we && !L,
             [l.listIsMobile]: K
           }),
           style: { gap: ve },
           children: [
-            r.map(je),
+            d.map(je),
             k ? Array(v).fill().map((e, s) => s).map(Be) : null
           ]
         }

package/dist/components/list/paginated_list/action_bar/ActionBar.js

@@ -1,114 +1,121 @@
-import { jsx as r, Fragment as T, jsxs as d } from "react/jsx-runtime";
-import R from "classnames";
-import { useState as v, useRef as G, useCallback as J, useEffect as K } from "react";
-import { useIntl as Q } from "react-intl";
-import { useLocation as V } from "react-router";
+import { jsx as r, Fragment as k, jsxs as d } from "react/jsx-runtime";
+import x from "classnames";
+import { useState as b, useRef as K, useCallback as Q, useEffect as U } from "react";
+import { useIntl as V } from "react-intl";
+import { useLocation as X, useNavigate as Y } from "react-router";
 import t from "./ActionBar.module.scss.js";
-import { useResponsive as X } from "../../../hooks/use_responsive/useResponsive.js";
-import { SearchInput as Y } from "../../../input/search_input/SearchInput.js";
-import { Select as Z } from "../../../input/select/Select.js";
-import { Icon as b } from "../../../icons/icon/Icon.js";
-import { Tag as U } from "../../../tag/tag/Tag.js";
-const de = ({
-  title: f,
+import { useResponsive as Z } from "../../../hooks/use_responsive/useResponsive.js";
+import { SearchInput as q } from "../../../input/search_input/SearchInput.js";
+import { Select as O } from "../../../input/select/Select.js";
+import { Icon as y } from "../../../icons/icon/Icon.js";
+import { Tag as ee } from "../../../tag/tag/Tag.js";
+const fe = ({
+  title: m,
   subtitle: w,
-  showDebateConsultationSubtitle: k = !1,
+  showDebateConsultationSubtitle: $ = !1,
   sortOptions: n,
-  defaultSelectOption: x,
+  defaultSelectOption: L,
   searchBar: o = !1,
-  tagList: m,
-  pinnedTagList: h = [],
-  activeTagId: u,
-  withUrlParams: g = !1,
-  onSearch: $,
-  onSortChange: L,
-  onTagChange: H
+  tagList: h,
+  pinnedTagList: f = [],
+  activeTagId: g,
+  withUrlParams: u = !1,
+  onSearch: H,
+  onSortChange: B,
+  onTagChange: M
 }) => {
-  const B = Q(), M = V(), { isMobile: q } = X(), [j, z] = v(!1), s = G(null), [y, P] = v(!1), [A, W] = v(!1), a = new URLSearchParams(
-    typeof window < "u" ? window.location.search : M.search
-  ), S = Array.isArray(m) ? m : m?.data || [], C = [
+  const P = V(), A = X(), j = Y(), { isMobile: te } = Z(), [z, W] = b(!1), s = K(null), [N, _] = b(!1), [C, D] = b(!1), l = new URLSearchParams(A.search), p = Array.isArray(h) ? h : h?.data || [], I = [
     ...new Set(
-      (Array.isArray(h) ? h : [h]).filter(Boolean).map(String)
+      (Array.isArray(f) ? f : [f]).filter(Boolean).map(String)
     )
-  ], p = S.length > 0 ? [
-    ...C.map((e) => S.find((l) => String(l.id) === e)).filter(Boolean),
-    ...S.filter((e) => !C.includes(String(e.id)))
-  ] : [], i = J(() => {
+  ], S = p.length > 0 ? [
+    ...I.map((e) => p.find((a) => String(a.id) === e)).filter(Boolean),
+    ...p.filter((e) => !I.includes(String(e.id)))
+  ] : [], i = Q(() => {
     const e = s.current;
-    e && (P(e.scrollLeft > 1), W(e.scrollLeft + e.clientWidth < e.scrollWidth - 1));
+    e && (_(e.scrollLeft > 1), D(e.scrollLeft + e.clientWidth < e.scrollWidth - 1));
   }, []);
-  K(() => {
+  U(() => {
     i();
     const e = s.current;
     if (!e) return;
-    const l = new ResizeObserver(i);
-    return l.observe(e), () => l.disconnect();
-  }, [p, i]);
-  const I = (e, l) => {
-    l.stopPropagation();
+    const a = new ResizeObserver(i);
+    return a.observe(e), () => a.disconnect();
+  }, [S, i]);
+  const T = (e, a) => {
+    a.stopPropagation();
     const c = s.current;
     if (!c) return;
-    const N = 200;
+    const R = 200;
     c.scrollBy({
-      left: e === "left" ? -N : N,
+      left: e === "left" ? -R : R,
       behavior: "smooth"
     }), setTimeout(i, 300);
-  }, _ = (e) => {
-    if (g) {
-      for (const l of a.keys())
+  }, v = () => {
+    const e = l.toString();
+    j(
+      {
+        pathname: A.pathname,
+        search: e ? `?${e}` : ""
+      },
+      { replace: !0 }
+    );
+  }, E = (e) => {
+    if (u) {
+      for (const a of l.keys())
         n.map((c) => {
-          c.name === l && a.delete(l);
+          c.name === a && l.delete(a);
         });
-      a.delete("sort"), a.set(
+      l.delete("sort"), l.set(
         e.type === "filter" ? e.name : "sort",
         e.value
-      );
+      ), v();
     }
-    L(e);
-  }, D = (e) => {
-    g && (e.id === u ? a.delete("tagId") : a.set("tagId", e.id)), H(e.id === u ? null : e.id);
-  }, E = (e) => {
-    g && (e ? a.set("search", e) : a.delete("search")), $(e), z(e !== "");
+    B(e);
   }, F = (e) => {
-    const l = u === e.id;
+    u && (e.id === g ? l.delete("tagId") : l.set("tagId", e.id), v()), M(e.id === g ? null : e.id);
+  }, G = (e) => {
+    u && (e ? l.set("search", e) : l.delete("search"), v()), H(e), W(e !== "");
+  }, J = (e) => {
+    const a = g === e.id;
     return /* @__PURE__ */ r(
       "div",
       {
         className: t.tagItem,
-        onClick: () => D(e),
+        onClick: () => F(e),
         children: /* @__PURE__ */ r(
-          U,
+          ee,
           {
             text: e.display_name,
-            active: l,
-            rightIcon: l && /* @__PURE__ */ r(b, { name: "close", height: 10, width: 10 })
+            active: a,
+            rightIcon: a && /* @__PURE__ */ r(y, { name: "close", height: 10, width: 10 })
           }
         )
       },
       e.id
     );
   };
-  return /* @__PURE__ */ r(T, { children: (f || n || o) && /* @__PURE__ */ d(T, { children: [
+  return /* @__PURE__ */ r(k, { children: (m || n || o) && /* @__PURE__ */ d(k, { children: [
     /* @__PURE__ */ d(
       "div",
       {
-        className: R(t.listHeader, {
+        className: x(t.listHeader, {
           [t.listHeaderOneItem]: !o || !n
         }),
         children: [
-          f && /* @__PURE__ */ r("div", { className: t.listTitle, children: f }),
+          m && /* @__PURE__ */ r("div", { className: t.listTitle, children: m }),
           (n || o) && /* @__PURE__ */ d(
             "div",
             {
-              className: R(t.rightBar, {
+              className: x(t.rightBar, {
                 [t.rightBarOneItem]: !o || !n
               }),
               children: [
                 o ? /* @__PURE__ */ r("div", { className: t.search, children: /* @__PURE__ */ r(
-                  Y,
+                  q,
                   {
-                    onSearchSubmit: E,
-                    placeholder: B.formatMessage({
+                    onSearchSubmit: G,
+                    placeholder: P.formatMessage({
                       id: "info.search_mobile",
                       defaultMessage: "Search"
                     }),
@@ -116,13 +123,13 @@ const de = ({
                   }
                 ) }) : null,
                 n ? /* @__PURE__ */ r(
-                  Z,
+                  O,
                   {
-                    onChange: _,
+                    onChange: E,
                     options: n,
-                    defaultOption: x,
+                    defaultOption: L,
                     horizontalPosition: "right",
-                    disabled: j,
+                    disabled: z,
                     className: t.select
                   }
                 ) : null
@@ -132,17 +139,17 @@ const de = ({
         ]
       }
     ),
-    k && w && /* @__PURE__ */ r("div", { className: t.listSubtitle, children: w }),
-    p.length > 0 && /* @__PURE__ */ d("div", { className: t.tagSection, children: [
+    $ && w && /* @__PURE__ */ r("div", { className: t.listSubtitle, children: w }),
+    S.length > 0 && /* @__PURE__ */ d("div", { className: t.tagSection, children: [
       /* @__PURE__ */ r(
         "button",
         {
           type: "button",
-          className: `${t.arrow} ${t.arrowLeft} ${y ? "" : t.arrowHidden}`,
-          onClick: (e) => I("left", e),
+          className: `${t.arrow} ${t.arrowLeft} ${N ? "" : t.arrowHidden}`,
+          onClick: (e) => T("left", e),
           "aria-label": "Tag précédent",
-          tabIndex: y ? 0 : -1,
-          children: /* @__PURE__ */ r(b, { name: "lightArrow", height: 24, width: 24 })
+          tabIndex: N ? 0 : -1,
+          children: /* @__PURE__ */ r(y, { name: "lightArrow", height: 24, width: 24 })
         }
       ),
       /* @__PURE__ */ r(
@@ -151,23 +158,23 @@ const de = ({
           ref: s,
           className: t.tagList,
           onScroll: i,
-          children: p.map(F)
+          children: S.map(J)
         }
       ),
       /* @__PURE__ */ r(
         "button",
         {
           type: "button",
-          className: `${t.arrow} ${t.arrowRight} ${A ? "" : t.arrowHidden}`,
-          onClick: (e) => I("right", e),
+          className: `${t.arrow} ${t.arrowRight} ${C ? "" : t.arrowHidden}`,
+          onClick: (e) => T("right", e),
           "aria-label": "Tag suivant",
-          tabIndex: A ? 0 : -1,
-          children: /* @__PURE__ */ r(b, { name: "lightArrow", height: 24, width: 24 })
+          tabIndex: C ? 0 : -1,
+          children: /* @__PURE__ */ r(y, { name: "lightArrow", height: 24, width: 24 })
         }
       )
     ] })
   ] }) });
 };
 export {
-  de as ActionBar
+  fe as ActionBar
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logora/debate",
-  "version": "0.4.80",
+  "version": "0.4.82",
   "type": "module",
   "license": "AGPL-3.0",
   "description": "Design system of @Logora made with React",