@logora/debate 0.3.119 → 0.4.0

package/dist/components/auth/auth_initializer/AuthInitializer.js

@@ -1,52 +1,73 @@
-import { useEffect as u } from "react";
-import { useAuthInterceptor as v } from "../use_auth/useAuthInterceptor.js";
-import { authTokenHandler as w } from "../use_auth/authTokenHandler.js";
-import { useAuthActions as q } from "../use_auth/useAuthActions.js";
-import { useAuthRequired as I } from "../../hooks/use_auth_required/useAuthRequired.js";
-import { AuthProviderFactory as P } from "../providers/AuthProviderFactory.js";
-import { httpClient as n } from "../../data/axios_client/httpClient.js";
-const U = ({ authUrl: o, authType: c, provider: a, assertion: m }) => {
-  const r = "logora_user_token";
-  v(n, o, r);
-  const { getToken: f, removeToken: h } = w(
-    n,
-    o,
-    r
-  ), { loginUser: d, logoutUser: l, fetchUser: A } = q(
-    n,
-    o,
-    r
-  ), i = I();
-  u(() => {
-    p();
-  }, []), u(() => {
+import { jsx as d, Fragment as q } from "react/jsx-runtime";
+import { useState as E, useEffect as f } from "react";
+import { useConfig as _ } from "../../data/config_provider/useConfig.js";
+import { useAuthInterceptor as J } from "../use_auth/useAuthInterceptor.js";
+import { authTokenHandler as S } from "../use_auth/authTokenHandler.js";
+import { useAuthActions as T } from "../use_auth/useAuthActions.js";
+import { useAuthRequired as W } from "../../hooks/use_auth_required/useAuthRequired.js";
+import { useAuth as y } from "../use_auth/useAuth.js";
+import { AuthProviderFactory as z } from "../providers/AuthProviderFactory.js";
+import { UpdateUserInfoModal as L } from "../../user/update_user_info_modal/UpdateUserInfoModal.js";
+import { httpClient as a } from "../../data/axios_client/httpClient.js";
+const N = ({ authUrl: s, authType: r, provider: g, assertion: p }) => {
+  const i = "logora_user_token", e = _();
+  J(a, s, i);
+  const [w, u] = E(!1), { getToken: A, removeToken: v } = S(
+    a,
+    s,
+    i
+  ), { loginUser: c, logoutUser: C, fetchUser: P } = T(
+    a,
+    s,
+    i
+  ), U = W(), { setIsLoggingIn: k } = y();
+  f(() => {
+    I();
+  }, []);
+  const h = (o) => {
+    r !== "social" && r !== "oauth2_server" && e.auth?.showOnboarding === !0 ? u(!0) : U(o);
+  };
+  f(() => {
     if (typeof window < "u")
-      return window.addEventListener(
-        "logora:authentication:require",
-        i
-      ), () => {
-        window.removeEventListener(
-          "logora:authentication:require",
-          i
-        );
+      return window.addEventListener("logora:authentication:require", h), () => {
+        window.removeEventListener("logora:authentication:require", h);
       };
   }, []);
-  const p = () => {
-    const e = g(), t = f();
+  const I = () => {
+    const o = l(), t = A();
     if (t) {
-      const k = t.session_id;
-      e.isSameUser(k) ? A() : (h(), s(e));
+      const n = t.session_id;
+      o.isSameUser(n) ? P() : (v(), m(o));
     } else
-      s(e);
-  }, s = (e) => {
-    if (e.shouldInitAuth()) {
-      const t = e.getAuthorizationParams();
-      t && d(t);
+      m(o);
+  }, m = (o) => {
+    if (o.shouldInitAuth()) {
+      const t = o.getAuthorizationParams();
+      if (t) {
+        if (r !== "social" && r !== "oauth2_server" && e.auth?.showOnboarding === !0) {
+          k(!1);
+          return;
+        }
+        c(t);
+      }
     } else
-      l();
-  }, g = () => P.create(c, a, m);
-  return null;
+      C();
+  }, b = (o) => {
+    const n = l().getAuthorizationParams();
+    c({ ...n, ...o }), u(!1);
+  }, l = () => z.create(r, g, p);
+  return /* @__PURE__ */ d(q, { children: w && /* @__PURE__ */ d(
+    L,
+    {
+      pendingAuth: !0,
+      onConsentConfirmed: b,
+      showTerms: e.auth?.hideCgu !== !0,
+      showEmailConsent: e.auth?.showEmailConsent,
+      termsUrl: e.provider?.cguUrl || "https://www.logora.com/blog-posts/cgu",
+      privacyUrl: e.provider?.privacyUrl || "https://www.logora.com/blog-posts/privacy-policy"
+    }
+  ) });
 };
 export {
-  U as AuthInitializer
+  N as AuthInitializer
 };

package/dist/components/auth/use_auth/useAuthActions.js

@@ -1,9 +1,9 @@
-import { authTokenHandler as m } from "./authTokenHandler.js";
+import { authTokenHandler as E } from "./authTokenHandler.js";
 import { useAuth as w } from "./useAuth.js";
 import { useDataProvider as v } from "../../data/data_provider/useDataProvider.js";
-const I = "logora:emailConsent", L = (i, u, f) => {
-  const { removeToken: a, fetchToken: d } = m(
-    i,
+const A = "logora:emailConsent", L = (c, u, f) => {
+  const { removeToken: a, fetchToken: d } = E(
+    c,
     u,
     f
   ), { setCurrentUser: n, setIsLoggedIn: s, setIsLoggingIn: t, setAuthError: r } = w(), l = v(), h = (e) => {
@@ -12,23 +12,23 @@ const I = "logora:emailConsent", L = (i, u, f) => {
       return;
     }
     d(e).then((o) => {
-      c();
+      i();
     }).catch((o) => {
       r(o);
     });
   }, g = () => {
-    s(!1), t(!1), n({}), a(), E();
-  }, c = () => {
+    s(!1), t(!1), n({}), a(), sessionStorage.removeItem(A), p();
+  }, i = () => {
     l.getOneWithToken("me", "").then((e) => {
       if (e.data.success) {
         const o = e.data.data.resource;
-        n(o), s(!0), t(!1), p(o);
+        n(o), s(!0), t(!1), m(o);
       } else
         r(!0), s(!1), t(!1), n({}), a();
     }).catch((e) => {
       r(!0), s(!1), t(!1), n({}), a();
     });
-  }, p = (e) => {
+  }, m = (e) => {
     typeof window < "u" && window.dispatchEvent(
       new CustomEvent("logora:authentication:success", {
         detail: {
@@ -36,16 +36,16 @@ const I = "logora:emailConsent", L = (i, u, f) => {
         }
       })
     );
-  }, E = () => {
+  }, p = () => {
     typeof window < "u" && window.dispatchEvent(new CustomEvent("logora:authentication:logout"));
   };
   return {
     loginUser: h,
     logoutUser: g,
-    fetchUser: c
+    fetchUser: i
   };
 };
 export {
-  I as EMAIL_CONSENT_STORAGE_KEY,
+  A as EMAIL_CONSENT_STORAGE_KEY,
   L as useAuthActions
 };

package/dist/components/user/update_user_info_modal/UpdateUserInfoModal.js

@@ -1,225 +1,238 @@
-import { jsx as a, jsxs as o, Fragment as w } from "react/jsx-runtime";
-import { useState as n } from "react";
-import { useIntl as Y, FormattedMessage as Z } from "react-intl";
+import { jsx as a, jsxs as d, Fragment as S } from "react/jsx-runtime";
+import { useState as l } from "react";
+import { useIntl as ee, FormattedMessage as ae } from "react-intl";
 import t from "./UpdateUserInfoModal.module.scss.js";
-import { useAuth as ee } from "../../auth/use_auth/useAuth.js";
-import { useDataProvider as ae } from "../../data/data_provider/useDataProvider.js";
-import { useConfig as te } from "../../data/config_provider/useConfig.js";
-import { useResponsive as se } from "../../hooks/use_responsive/useResponsive.js";
-import { useFormValidation as re } from "../../forms/use_form_validation/useFormValidation.js";
-import { useModal as ie } from "../../dialog/modal/useModal.js";
+import { useAuth as te } from "../../auth/use_auth/useAuth.js";
+import { useDataProvider as se } from "../../data/data_provider/useDataProvider.js";
+import { useConfig as re } from "../../data/config_provider/useConfig.js";
+import { useResponsive as ie } from "../../hooks/use_responsive/useResponsive.js";
+import { useFormValidation as le } from "../../forms/use_form_validation/useFormValidation.js";
+import { useModal as oe } from "../../dialog/modal/useModal.js";
 import { Modal as ne } from "../../dialog/modal/Modal.js";
-import { Loader as le } from "../../progress/loader/Loader.js";
-import { Icon as oe } from "../../icons/icon/Icon.js";
-import { Button as I } from "../../action/button/Button.js";
-import { TextInput as A } from "../../input/text_input/TextInput.js";
-import { Select as de } from "../../input/select/Select.js";
-import { Toggle as S } from "../../input/toggle/Toggle.js";
+import { Loader as de } from "../../progress/loader/Loader.js";
 import { AvatarSelector as ce } from "../avatar_selector/AvatarSelector.js";
-const Ie = ({
-  termsUrl: O,
-  privacyUrl: F,
-  showEmailConsent: M = !1,
-  showTerms: u = !1
+import { Icon as me } from "../../icons/icon/Icon.js";
+import { Button as D } from "../../action/button/Button.js";
+import { TextInput as O } from "../../input/text_input/TextInput.js";
+import { Select as ue } from "../../input/select/Select.js";
+import { Toggle as F } from "../../input/toggle/Toggle.js";
+const De = ({
+  termsUrl: L,
+  privacyUrl: B,
+  showEmailConsent: v = !1,
+  showTerms: h = !1,
+  pendingAuth: n = !1,
+  onConsentConfirmed: y = null
 }) => {
-  const l = ee(), D = ae(), i = Y(), r = te(), L = [...Array(r.avatars?.maxFileName || 0).keys()].map(
-    (e) => `${r.avatars?.baseUrl}/${e + 1}.${r.avatars?.fileExtension}`
-  ), [f, B] = n(l.currentUser.first_name || ""), [p, $] = n(
-    l.currentUser.description || ""
-  ), [g, j] = n(l.currentUser.last_name || ""), [_, R] = n(l.currentUser.language), [q, h] = n(!1), [N, U] = n(
-    l.currentUser.image_url
-  ), [c, E] = n(null), [C, x] = n(!1), [z, T] = n(!1), { isMobile: y } = se(), { errors: d, validate: V } = re(), { hideModal: k } = ie(), [v, W] = n(!1), [b, G] = n(!1), H = (e) => {
+  const o = te(), A = se(), r = ee(), i = re(), $ = [...Array(i.avatars?.maxFileName || 0).keys()].map(
+    (e) => `${i.avatars?.baseUrl}/${e + 1}.${i.avatars?.fileExtension}`
+  ), [m, j] = l(o.currentUser.first_name || ""), [b, R] = l(
+    o.currentUser.description || ""
+  ), [u, q] = l(o.currentUser.last_name || ""), [M, z] = l(o.currentUser.language), [E, N] = l(!1), [x, C] = l(
+    o.currentUser.image_url
+  ), [f, T] = l(null), [k, P] = l(!1), [V, W] = l(!1), { isMobile: I } = ie(), { errors: c, validate: G } = le(), { hideModal: w } = oe(), [p, H] = l(!1), [_, J] = l(!1), K = (e) => {
     const s = new FileReader();
     s.onloadend = () => {
-      U(s.result);
+      C(s.result);
     }, s.readAsDataURL(e);
-  }, J = [
+  }, Q = [
     { first_name: ["required", null] },
     { first_name: ["minChar", 2] },
     { last_name: ["required", null] },
     { last_name: ["minChar", 2] },
-    { language: ["required", null] },
-    ...u ? [{ accepts_terms: ["enforceValue", !0] }] : []
-  ], K = (e) => {
+    ...n ? [] : [{ language: ["required", null] }],
+    ...h ? [{ accepts_terms: ["enforceValue", !0] }] : []
+  ], X = (e) => {
     e.preventDefault();
     const s = {};
-    if (f && (s.first_name = f), g && (s.last_name = g), _ && (s.language = _), c && C && (s.image = c), c && !C && (s.origin_image_url = c), p && (s.description = p), M && (s.accepts_provider_email = b), u && (s.accepts_terms = v), s.is_onboarded = !0, V(s, J)) {
-      T(!0);
-      const P = new FormData();
-      Object.entries(s).forEach(([m, X]) => {
-        P.append(m, X);
-      }), D.update("users", l.currentUser.slug, P).then((m) => {
-        m.data.success && l.setCurrentUser(m.data.data.resource), k();
-      });
-    }
-  }, Q = (e) => {
+    if (m && (s.first_name = m), u && (s.last_name = u), M && (s.language = M), f && k && (s.image = f), f && !k && (s.origin_image_url = f), b && (s.description = b), v && (s.accepts_provider_email = _), h && (s.accepts_terms = p), s.is_onboarded = !0, G(s, Q))
+      if (W(!0), n && y)
+        y({
+          first_name: m,
+          last_name: u,
+          accepts_terms: p,
+          accepts_provider_email: v ? _ : !1,
+          is_onboarded: !0
+        });
+      else {
+        const U = new FormData();
+        Object.entries(s).forEach(([g, Z]) => {
+          U.append(g, Z);
+        }), A.update("users", o.currentUser.slug, U).then((g) => {
+          g.data.success && o.setCurrentUser(g.data.data.resource), w();
+        });
+      }
+  }, Y = (e) => {
     const s = /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/i;
-    E(e), h(!1), s.test(e) ? (U(e), x(!1)) : (x(!0), H(e));
+    T(e), N(!1), s.test(e) ? (C(e), P(!1)) : (P(!0), K(e));
   };
   return /* @__PURE__ */ a(
     ne,
     {
       "data-vid": "update_user_info_modal",
-      title: i.formatMessage({
+      title: n ? r.formatMessage({
+        id: "modal.update_user_info_modal.complete_registration",
+        defaultMessage: "Complete your registration"
+      }) : r.formatMessage({
         id: "modal.update_user_info_modal.modal_title",
         defaultMessage: "Update your profile"
       }),
       style: {
-        width: y ? "unset" : "max-content",
-        minWidth: y ? "unset" : "500px",
+        width: I ? "unset" : "max-content",
+        minWidth: I ? "unset" : "500px",
         maxWidth: "800px"
       },
       showCloseButton: !1,
       disableClickOutside: !0,
-      children: z ? /* @__PURE__ */ a(le, {}) : q ? /* @__PURE__ */ o(w, { children: [
+      children: V ? /* @__PURE__ */ a(de, {}) : E && !n ? /* @__PURE__ */ d(S, { children: [
         /* @__PURE__ */ a(
           ce,
           {
-            onChooseAvatar: Q,
-            avatarUrlList: L,
-            userName: l.currentUser.full_name,
-            allowUserImage: r.avatars?.allowUserImage
+            onChooseAvatar: Y,
+            avatarUrlList: $,
+            userName: o.currentUser.full_name,
+            allowUserImage: i.avatars?.allowUserImage
           }
         ),
         /* @__PURE__ */ a(
           "div",
           {
             className: t.backButton,
-            onClick: () => h(!1),
-            children: i.formatMessage({
+            onClick: () => N(!1),
+            children: r.formatMessage({
               id: "user.user_edit.back",
               defaultMessage: "Back"
             })
           }
         )
-      ] }) : /* @__PURE__ */ o(w, { children: [
-        /* @__PURE__ */ o("div", { className: t.container, children: [
-          /* @__PURE__ */ o("div", { className: t.userImageContainer, children: [
-            N ? /* @__PURE__ */ a(
+      ] }) : /* @__PURE__ */ d(S, { children: [
+        /* @__PURE__ */ d("div", { className: t.container, children: [
+          /* @__PURE__ */ d("div", { className: t.userImageContainer, children: [
+            x ? /* @__PURE__ */ a(
               "img",
               {
                 className: t.userPictureUpload,
-                src: N,
-                alt: i.formatMessage({
+                src: x,
+                alt: r.formatMessage({
                   id: "alt.my_profile_picture",
                   defaultMessage: "Ma photo de profil"
                 })
               }
             ) : /* @__PURE__ */ a("div", { className: t.userPictureUpload, children: /* @__PURE__ */ a(
-              oe,
+              me,
               {
                 name: "camera",
                 height: 20,
                 width: 20,
-                alt: i.formatMessage({
+                alt: r.formatMessage({
                   id: "user.user_edit.profile_picture",
                   defaultMessage: "Profile picture"
                 })
               }
             ) }),
-            /* @__PURE__ */ a(
-              I,
+            !n && /* @__PURE__ */ a(
+              D,
               {
                 "data-testid": "avatar-button",
                 "data-tid": "action_save_profile",
-                onClick: () => h(!0),
+                onClick: () => N(!0),
                 style: { whiteSpace: "nowrap" },
-                children: i.formatMessage({
+                children: r.formatMessage({
                   id: "user.user_edit.avatar",
                   defaultMessage: "Select an avatar"
                 })
               }
             )
           ] }),
-          /* @__PURE__ */ o("div", { className: t.inputsContainer, children: [
-            /* @__PURE__ */ o("div", { className: t.nameContainer, children: [
+          /* @__PURE__ */ d("div", { className: t.inputsContainer, children: [
+            /* @__PURE__ */ d("div", { className: t.nameContainer, children: [
               /* @__PURE__ */ a("div", { className: t.updateProfileInput, children: /* @__PURE__ */ a(
-                A,
+                O,
                 {
                   type: "text",
                   name: "first_name",
-                  "aria-label": i.formatMessage({
+                  "aria-label": r.formatMessage({
                     id: "auth.signup_form.first_name.aria_label",
                     defaultMessage: "First name"
                   }),
-                  placeholder: i.formatMessage({
+                  placeholder: r.formatMessage({
                     id: "auth_signup_form_first_name_placeholder",
                     defaultMessage: "First name"
                   }),
-                  onChange: (e) => r.actions?.disableOnboardingNameUpdate === !0 ? null : B(e.target.value),
-                  value: f,
-                  error: !!d.first_name,
-                  message: d.first_name,
+                  onChange: (e) => i.actions?.disableOnboardingNameUpdate === !0 ? null : j(e.target.value),
+                  value: m,
+                  error: !!c.first_name,
+                  message: c.first_name,
                   "data-testid": "first-name",
-                  disabled: r.actions?.disableOnboardingNameUpdate === !0
+                  disabled: i.actions?.disableOnboardingNameUpdate === !0
                 }
               ) }),
               /* @__PURE__ */ a("div", { className: t.updateProfileInput, children: /* @__PURE__ */ a(
-                A,
+                O,
                 {
                   type: "text",
                   name: "last_name",
-                  "aria-label": i.formatMessage({
+                  "aria-label": r.formatMessage({
                     id: "auth.signup_form.last_name.aria_label",
                     defaultMessage: "Last name"
                   }),
-                  placeholder: i.formatMessage({
+                  placeholder: r.formatMessage({
                     id: "auth_signup_form_last_name_placeholder",
                     defaultMessage: "Last name"
                   }),
-                  onChange: (e) => r.actions?.disableOnboardingNameUpdate === !0 ? null : j(e.target.value),
-                  value: g,
-                  error: !!d.last_name,
-                  message: d.last_name,
+                  onChange: (e) => i.actions?.disableOnboardingNameUpdate === !0 ? null : q(e.target.value),
+                  value: u,
+                  error: !!c.last_name,
+                  message: c.last_name,
                   "data-testid": "last-name",
-                  disabled: r.actions?.disableOnboardingNameUpdate === !0
+                  disabled: i.actions?.disableOnboardingNameUpdate === !0
                 }
               ) })
             ] }),
-            r.actions?.disableNameUpdate == !0 && r.actions?.disableOnboardingNameUpdate != !0 && /* @__PURE__ */ a("div", { className: t.hint, children: i.formatMessage({
+            i.actions?.disableNameUpdate == !0 && i.actions?.disableOnboardingNameUpdate != !0 && /* @__PURE__ */ a("div", { className: t.hint, children: r.formatMessage({
               id: "user.user_edit.user_name_hint",
               defaultMessage: "last name"
             }) }),
-            r.translation?.translationMethods && Object.keys(r.translation.translationMethods).length > 0 && /* @__PURE__ */ a(
-              de,
+            !n && i.translation?.translationMethods && Object.keys(i.translation.translationMethods).length > 0 && /* @__PURE__ */ a(
+              ue,
               {
                 selectClassName: t.langSelect,
                 options: Object.keys(
-                  r.translation.translationMethods
+                  i.translation.translationMethods
                 ).map((e) => ({
                   name: e,
                   value: e,
                   text: `${e.toUpperCase()}`
                 })),
-                defaultOption: _,
-                onChange: (e) => R(e.value)
+                defaultOption: M,
+                onChange: (e) => z(e.value)
               }
             ),
-            /* @__PURE__ */ a("div", { className: t.userDescription, children: /* @__PURE__ */ a(
+            !n && /* @__PURE__ */ a("div", { className: t.userDescription, children: /* @__PURE__ */ a(
               "textarea",
               {
                 className: t.textArea,
-                placeholder: i.formatMessage({
+                placeholder: r.formatMessage({
                   id: "user.user_edit.user_description",
                   defaultMessage: "Describe yourself in a few words"
                 }),
-                value: p,
-                onChange: (e) => $(e.target.value),
+                value: b,
+                onChange: (e) => R(e.target.value),
                 maxLength: 500,
                 "data-testid": "description"
               }
             ) })
           ] })
         ] }),
-        u && /* @__PURE__ */ a("div", { className: t.toggle, children: /* @__PURE__ */ a(
-          S,
+        h && /* @__PURE__ */ a("div", { className: t.toggle, children: /* @__PURE__ */ a(
+          F,
           {
             type: "checkbox",
             name: "accepts_terms",
             style: { fontSize: 18 },
-            checked: v,
+            checked: p,
             label: /* @__PURE__ */ a(
-              Z,
+              ae,
               {
                 id: "modal.update_user_info_modal.accepts_terms",
                 defaultMessage: "I declare I have read the <var1>General Conditions of Use</var1> and the <var2>Privacy policy</var2> of the debate space and accept them.",
@@ -229,7 +242,7 @@ const Ie = ({
                     {
                       className: t.cgu,
                       target: "_blank",
-                      href: O,
+                      href: L,
                       rel: "noreferrer",
                       children: e
                     }
@@ -239,7 +252,7 @@ const Ie = ({
                     {
                       className: t.cgu,
                       target: "_blank",
-                      href: F,
+                      href: B,
                       rel: "noreferrer",
                       children: e
                     }
@@ -247,36 +260,36 @@ const Ie = ({
                 }
               }
             ),
-            onInputChanged: (e) => W(!v),
-            message: d.accepts_terms,
+            onInputChanged: (e) => H(!p),
+            message: c.accepts_terms,
             "data-testid": "accepts-terms-input"
           }
         ) }),
-        M && /* @__PURE__ */ a("div", { className: t.toggle, children: /* @__PURE__ */ a(
-          S,
+        v && /* @__PURE__ */ a("div", { className: t.toggle, children: /* @__PURE__ */ a(
+          F,
           {
             type: "checkbox",
             name: "accepts_provider_email",
             style: { fontSize: 18 },
-            checked: b,
-            label: i.formatMessage(
+            checked: _,
+            label: r.formatMessage(
               {
                 id: "modal.update_user_info_modal.consent_label",
                 defaultMessage: "I agree to receive emails from the editor"
               },
-              { provider: r.provider?.companyName }
+              { provider: i.provider?.companyName }
             ),
-            onInputChanged: (e) => G(!b),
+            onInputChanged: (e) => J(!_),
             "data-testid": "accepts-email-input"
           }
         ) }),
         /* @__PURE__ */ a("div", { className: t.userSaveBox, children: /* @__PURE__ */ a(
-          I,
+          D,
           {
             "data-testid": "save-button",
             "data-tid": "action_save_profile",
-            onClick: (e) => K(e),
-            children: i.formatMessage({
+            onClick: (e) => X(e),
+            children: r.formatMessage({
               id: "user.user_edit.save",
               defaultMessage: "Save"
             })
@@ -287,5 +300,5 @@ const Ie = ({
   );
 };
 export {
-  Ie as UpdateUserInfoModal
+  De as UpdateUserInfoModal
 };

package/package.json

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