@edifice.io/react 2.1.2-develop-pedago.20250305164234 → 2.1.2-develop-pedago.20250317171843

package/dist/modules/comments/components/Comment.d.ts

@@ -1,7 +1,8 @@
 import { UserProfile } from '@edifice.io/client';
 import { CommentProps } from '../types';
-export declare const Comment: ({ comment, userId, profile, }: {
+export declare const Comment: ({ comment, userId, profile, onReply, }: {
     comment: CommentProps;
     userId: string;
     profile: UserProfile[number];
+    onReply?: (commentId: string) => void;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/modules/comments/components/Comment.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { useState, Suspense, lazy } from "react";
 import { useTranslation } from "react-i18next";
 import SvgIconSave from "../../icons/components/IconSave.js";
@@ -14,7 +14,8 @@ import LoadingScreen from "../../../components/LoadingScreen/LoadingScreen.js";
 const DeleteModal = /* @__PURE__ */ lazy(() => import("./DeleteModal.js")), Comment = ({
   comment,
   userId,
-  profile
+  profile,
+  onReply
 }) => {
   const [value, setValue] = useState(""), {
     id,
@@ -37,38 +38,41 @@ const DeleteModal = /* @__PURE__ */ lazy(() => import("./DeleteModal.js")), Comm
   } = useCommentsContext(), isEditing = editCommentId === comment.id, handleChangeContent = (event) => {
     resizeTextarea(), setValue(event.target.value);
   };
-  return /* @__PURE__ */ jsxs("div", { className: `${isEditing ? "border rounded-3 p-12 pb-8 d-flex gap-12 bg-gray-200  my-16" : "border rounded-3 p-12 pb-8 d-flex gap-12 mt-16"}`, children: [
-    /* @__PURE__ */ jsx(CommentAvatar, { id: authorId }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-fill", children: [
-      /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center gap-12", children: [
-        /* @__PURE__ */ jsx(CommentTitle, { children: authorName }),
-        /* @__PURE__ */ jsx(BadgeProfile, { profile }),
-        /* @__PURE__ */ jsx(CommentDate, { createdAt, updatedAt })
-      ] }),
-      isEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "mt-8 mb-4", children: /* @__PURE__ */ jsx("textarea", { id: "update-comment", ref, value, className: "form-control", placeholder: t("comment.placeholder"), maxLength: options.maxCommentLength, onChange: handleChangeContent, rows: 1, style: {
-          resize: "none",
-          overflow: "hidden"
-        }, onFocus }) }),
-        /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-between align-items-center", children: [
-          /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: handleReset, children: t("comment.cancel") }),
-          /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-end align-items-center gap-4", children: [
-            /* @__PURE__ */ jsx(TextCounter, { content: value, maxLength: options.maxCommentLength }),
-            /* @__PURE__ */ jsx(Button, { type: "submit", variant: "ghost", size: "sm", leftIcon: /* @__PURE__ */ jsx(SvgIconSave, {}), disabled: !(content != null && content.length), onClick: () => handleUpdateComment(value), children: t("comment.save") })
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: `${isEditing ? "border rounded-3 p-12 pb-8 d-flex gap-12 bg-gray-200  my-16" : "border rounded-3 p-12 pb-8 d-flex gap-12 mt-16"}`, children: [
+      /* @__PURE__ */ jsx(CommentAvatar, { id: authorId }),
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-fill", children: [
+        /* @__PURE__ */ jsxs("div", { className: "d-flex align-items-center gap-12", children: [
+          /* @__PURE__ */ jsx(CommentTitle, { children: authorName }),
+          /* @__PURE__ */ jsx(BadgeProfile, { profile }),
+          /* @__PURE__ */ jsx(CommentDate, { createdAt, updatedAt })
+        ] }),
+        isEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: "mt-8 mb-4", children: /* @__PURE__ */ jsx("textarea", { id: "update-comment", ref, value, className: "form-control", placeholder: t("comment.placeholder"), maxLength: options.maxCommentLength, onChange: handleChangeContent, rows: 1, style: {
+            resize: "none",
+            overflow: "hidden"
+          }, onFocus }) }),
+          /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-between align-items-center", children: [
+            /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: handleReset, children: t("comment.cancel") }),
+            /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-end align-items-center gap-4", children: [
+              /* @__PURE__ */ jsx(TextCounter, { content: value, maxLength: options.maxCommentLength }),
+              /* @__PURE__ */ jsx(Button, { type: "submit", variant: "ghost", size: "sm", leftIcon: /* @__PURE__ */ jsx(SvgIconSave, {}), disabled: !(content != null && content.length), onClick: () => handleUpdateComment(value), children: t("comment.save") })
+            ] })
+          ] })
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("div", { className: "mt-8 mb-4", children: content }),
+          type === "edit" && /* @__PURE__ */ jsxs("div", { className: "ms-n8", children: [
+            !comment.replyTo && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: () => onReply == null ? void 0 : onReply(comment.id), children: t("comment.reply") }),
+            userId === authorId && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: () => {
+              handleModifyComment(comment.id), setValue(content);
+            }, children: t("comment.edit") }),
+            (userId === authorId || (userRights == null ? void 0 : userRights.manager)) && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: () => setIsDeleteModalOpen(!0), children: t("comment.remove") })
           ] })
-        ] })
-      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { className: "mt-8 mb-4", children: content }),
-        type === "edit" && /* @__PURE__ */ jsxs("div", { className: "ms-n8", children: [
-          userId === authorId && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: () => {
-            handleModifyComment(comment.id), setValue(content);
-          }, children: t("comment.edit") }),
-          (userId === authorId || (userRights == null ? void 0 : userRights.manager)) && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", size: "sm", onClick: () => setIsDeleteModalOpen(!0), children: t("comment.remove") })
         ] })
       ] })
-    ] }),
+    ] }, id),
     /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(LoadingScreen, { position: !1 }), children: isDeleteModalOpen && /* @__PURE__ */ jsx(DeleteModal, { isOpen: isDeleteModalOpen, onCancel: () => setIsDeleteModalOpen(!1), onSuccess: () => onDeleteComment(id) }) })
-  ] }, id);
+  ] });
 };
 export {
   Comment

package/dist/modules/comments/components/CommentForm.d.ts

@@ -1,3 +1,4 @@
-export declare const CommentForm: ({ userId }: {
+export declare const CommentForm: ({ userId, replyTo, }: {
     userId: string;
+    replyTo?: string;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/modules/comments/components/CommentForm.js

@@ -5,19 +5,23 @@ import { useAutosizeTextarea } from "../hooks/useAutosizeTextarea.js";
 import { useCommentsContext } from "../hooks/useCommentsContext.js";
 import { CommentAvatar } from "./CommentAvatar.js";
 import { TextCounter } from "./TextCounter.js";
+import { useState } from "react";
 import Button from "../../../components/Button/Button.js";
 const CommentForm = ({
-  userId
+  userId,
+  replyTo
 }) => {
-  const {
-    t
-  } = useTranslation(), {
-    content,
-    handleChangeContent,
+  const [content, setContent] = useState(""), {
     handleCreateComment,
     options,
     type
-  } = useCommentsContext(), [ref, onFocus] = useAutosizeTextarea();
+  } = useCommentsContext(), [ref, onFocus] = useAutosizeTextarea(), {
+    t
+  } = useTranslation(), handleChangeContent = (event) => {
+    setContent(event.target.value);
+  }, handleSubmit = () => {
+    handleCreateComment(content, replyTo), setContent("");
+  };
   return /* @__PURE__ */ jsx(Fragment, { children: type === "edit" && /* @__PURE__ */ jsxs("div", { className: "border rounded-3 p-12 pb-8 d-flex gap-12 bg-gray-200", children: [
     /* @__PURE__ */ jsx(CommentAvatar, { id: userId }),
     /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill gap-4", children: [
@@ -27,7 +31,7 @@ const CommentForm = ({
       } }),
       /* @__PURE__ */ jsxs("div", { className: "d-flex justify-content-end align-items-center gap-4", children: [
         /* @__PURE__ */ jsx(TextCounter, { content, maxLength: options.maxCommentLength }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "ghost", size: "sm", leftIcon: /* @__PURE__ */ jsx(SvgIconSend, {}), disabled: !(content != null && content.length), onClick: () => handleCreateComment(content), children: t("comment.post") })
+        /* @__PURE__ */ jsx(Button, { type: "submit", variant: "ghost", size: "sm", leftIcon: /* @__PURE__ */ jsx(SvgIconSend, {}), disabled: !(content != null && content.length), onClick: handleSubmit, children: t("comment.post") })
       ] })
     ] })
   ] }) });

package/dist/modules/comments/components/CommentList.js

@@ -1,20 +1,27 @@
-import { jsx } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
 import { useEdificeClient } from "../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
 import { useCommentsContext } from "../hooks/useCommentsContext.js";
 import { Comment } from "./Comment.js";
+import { CommentReplies } from "./CommentReplies.js";
 function CommentList() {
-  const {
+  const [replyFormCommentId, setReplyFormCommentId] = useState(""), {
     user
   } = useEdificeClient(), {
     comments,
     profiles
-  } = useCommentsContext();
+  } = useCommentsContext(), handleReply = (commentId) => {
+    setReplyFormCommentId(commentId);
+  };
   return comments == null ? void 0 : comments.map((comment) => {
     var _a;
     const {
       authorId
     } = comment, profile = ((_a = profiles == null ? void 0 : profiles.find((user2) => (user2 == null ? void 0 : user2.userId) === authorId)) == null ? void 0 : _a.profile) ?? "Guest";
-    return /* @__PURE__ */ jsx(Comment, { comment, profile, userId: user == null ? void 0 : user.userId }, comment.id);
+    return /* @__PURE__ */ jsxs("div", { children: [
+      !comment.replyTo && /* @__PURE__ */ jsx(Comment, { comment, profile, userId: user == null ? void 0 : user.userId, onReply: handleReply }),
+      /* @__PURE__ */ jsx(CommentReplies, { parentComment: comment, replyFormCommentId })
+    ] }, comment.id);
   });
 }
 export {

package/dist/modules/comments/components/CommentReplies.d.ts

@@ -0,0 +1,5 @@
+import { CommentProps } from '../types';
+export declare const CommentReplies: ({ parentComment, replyFormCommentId, }: {
+    parentComment: CommentProps;
+    replyFormCommentId: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/modules/comments/components/CommentReplies.js

@@ -0,0 +1,36 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useCommentsContext } from "../hooks/useCommentsContext.js";
+import { Comment } from "./Comment.js";
+import { CommentForm } from "./CommentForm.js";
+import { useCommentReplies } from "../hooks/useCommentReplies.js";
+import Button from "../../../components/Button/Button.js";
+const CommentReplies = ({
+  parentComment,
+  replyFormCommentId
+}) => {
+  const {
+    comments,
+    profiles,
+    options
+  } = useCommentsContext(), {
+    t,
+    user,
+    profile,
+    slicedReplies,
+    defaultReplies,
+    handleMoreReplies
+  } = useCommentReplies({
+    parentComment,
+    comments,
+    profiles,
+    options
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "comments-replies-container", children: [
+    replyFormCommentId === parentComment.id && /* @__PURE__ */ jsx("div", { className: "comments-replies-form", children: /* @__PURE__ */ jsx(CommentForm, { userId: user == null ? void 0 : user.userId, replyTo: parentComment.id }) }),
+    /* @__PURE__ */ jsx("div", { className: "comments-replies-list", children: slicedReplies.map((reply) => /* @__PURE__ */ jsx("div", { className: "comments-replies-reply", children: /* @__PURE__ */ jsx(Comment, { comment: reply, profile, userId: user == null ? void 0 : user.userId }) }, reply.id)) }),
+    slicedReplies.length < (defaultReplies == null ? void 0 : defaultReplies.length) && /* @__PURE__ */ jsx(Button, { variant: "ghost", color: "tertiary", onClick: handleMoreReplies, className: "ms-24", children: t("comment.more.replies") })
+  ] });
+};
+export {
+  CommentReplies
+};

package/dist/modules/comments/constants.d.ts

@@ -18,3 +18,7 @@ export declare const DEFAULT_ADD_COMMENTS = 5;
  * Limit to display replies of a comment
  */
 export declare const DEFAULT_MAX_REPLIES = 5;
+/**
+ * Number of comments to add when adding more comment in the limited list
+ */
+export declare const DEFAULT_ADD_REPLIES = 5;

package/dist/modules/comments/constants.js

@@ -1,6 +1,7 @@
-const DEFAULT_MAX_COMMENT_LENGTH = 200, DEFAULT_MAX_REPLY_LENGTH = 200, DEFAULT_MAX_COMMENTS = 4, DEFAULT_ADD_COMMENTS = 5, DEFAULT_MAX_REPLIES = 5;
+const DEFAULT_MAX_COMMENT_LENGTH = 200, DEFAULT_MAX_REPLY_LENGTH = 200, DEFAULT_MAX_COMMENTS = 4, DEFAULT_ADD_COMMENTS = 5, DEFAULT_MAX_REPLIES = 5, DEFAULT_ADD_REPLIES = 5;
 export {
   DEFAULT_ADD_COMMENTS,
+  DEFAULT_ADD_REPLIES,
   DEFAULT_MAX_COMMENTS,
   DEFAULT_MAX_COMMENT_LENGTH,
   DEFAULT_MAX_REPLIES,

package/dist/modules/comments/context/Context.d.ts

@@ -2,7 +2,6 @@ import { RightRole } from '@edifice.io/client';
 import { CommentOptions, CommentProps, CommentType, UserProfileResult } from '../types';
 export declare const CommentContext: import('react').Context<{
     comments: CommentProps[] | undefined;
-    content: string;
     editCommentId: string | null;
     profiles: (UserProfileResult | undefined)[];
     options: Partial<CommentOptions>;
@@ -10,8 +9,7 @@ export declare const CommentContext: import('react').Context<{
     userRights?: Record<RightRole, boolean>;
     setEditCommentId: (value: string | null) => void;
     handleModifyComment: (commentId: string) => void;
-    handleChangeContent: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
-    handleCreateComment: (content: string) => void;
+    handleCreateComment: (content: string, replyTo?: string) => void;
     handleUpdateComment: (comment: string) => void;
     handleDeleteComment: (id: string) => void;
     handleReset: () => void;

package/dist/modules/comments/hooks/useCommentReplies.d.ts

@@ -0,0 +1,15 @@
+import { CommentOptions, CommentProps, UserProfileResult } from '../types';
+export declare const useCommentReplies: ({ parentComment, comments, profiles, options, }: {
+    parentComment: CommentProps;
+    comments: CommentProps[] | undefined;
+    profiles: (UserProfileResult | undefined)[];
+    options: Partial<CommentOptions>;
+}) => {
+    t: import('i18next').TFunction<"translation", undefined>;
+    user: import('@edifice.io/client').IUserInfo | undefined;
+    profile: "Student" | "Teacher" | "Relative" | "Personnel" | "Guest";
+    slicedReplies: CommentProps[];
+    defaultReplies: CommentProps[];
+    orphanReplies: CommentProps[];
+    handleMoreReplies: () => void;
+};

package/dist/modules/comments/hooks/useCommentReplies.js

@@ -0,0 +1,36 @@
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useEdificeClient } from "../../../providers/EdificeClientProvider/EdificeClientProvider.hook.js";
+const useCommentReplies = ({
+  parentComment,
+  comments,
+  profiles,
+  options
+}) => {
+  var _a;
+  const {
+    maxReplies,
+    additionalReplies
+  } = options, [repliesLimit, setRepliesLimit] = useState(maxReplies), {
+    user
+  } = useEdificeClient(), {
+    t
+  } = useTranslation(), {
+    authorId
+  } = parentComment, profile = ((_a = profiles == null ? void 0 : profiles.find((user2) => (user2 == null ? void 0 : user2.userId) === authorId)) == null ? void 0 : _a.profile) ?? "Guest", defaultReplies = (comments == null ? void 0 : comments.filter((comment) => comment.replyTo === parentComment.id)) ?? [], slicedReplies = (defaultReplies == null ? void 0 : defaultReplies.sort((a, b) => b.createdAt - a.createdAt).slice(0, repliesLimit)) ?? [], orphanReplies = (comments == null ? void 0 : comments.filter((comment) => comment.replyTo && !comments.find((c) => c.id === comment.replyTo))) ?? [];
+  return {
+    t,
+    user,
+    profile,
+    slicedReplies,
+    defaultReplies,
+    orphanReplies,
+    handleMoreReplies: () => {
+      const newLimit = slicedReplies.length + (additionalReplies ?? 2);
+      newLimit !== slicedReplies.length && setRepliesLimit(newLimit);
+    }
+  };
+};
+export {
+  useCommentReplies
+};

package/dist/modules/comments/hooks/useComments.d.ts

@@ -12,7 +12,6 @@ export declare const useComments: ({ defaultComments, options, type, callbacks,
         } | undefined)[];
         isLoading: boolean;
     };
-    content: string;
     title: string;
     user: import('@edifice.io/client').IUserInfo | undefined;
     emptyscreenPath: string;
@@ -23,9 +22,8 @@ export declare const useComments: ({ defaultComments, options, type, callbacks,
     commentsCount: number;
     t: import('i18next').TFunction<"translation", undefined>;
     handleMoreComments: () => void;
-    handleChangeContent: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
     handleDeleteComment: (id: string) => void;
-    handleCreateComment: (content: string) => void;
+    handleCreateComment: (content: string, replyTo?: string) => void;
     handleModifyComment: (commentId: string) => void;
     handleUpdateComment: (comment: string) => Promise<void>;
     handleReset: () => void;

package/dist/modules/comments/hooks/useComments.js

@@ -9,7 +9,7 @@ const useComments = ({
   type,
   callbacks
 }) => {
-  const [content, setContent] = useState(""), [editCommentId, setEditCommentId] = useState(null), [commentLimit, setCommentLimit] = useState(options.maxComments), {
+  const [editCommentId, setEditCommentId] = useState(null), [commentLimit, setCommentLimit] = useState(options.maxComments), {
     t
   } = useTranslation(), {
     user
@@ -24,7 +24,6 @@ const useComments = ({
   });
   return {
     profilesQueries,
-    content,
     title,
     user,
     emptyscreenPath: illuPad,
@@ -38,14 +37,11 @@ const useComments = ({
       const newLimit = (comments == null ? void 0 : comments.length) + (options.additionalComments ?? 5);
       newLimit !== comments.length && setCommentLimit(newLimit);
     },
-    handleChangeContent: (event) => {
-      setContent(event.target.value);
-    },
     handleDeleteComment: (id) => {
       type === "edit" && (callbacks == null || callbacks.delete(id));
     },
-    handleCreateComment: (content2) => {
-      type === "edit" && (callbacks == null || callbacks.post(content2)), setContent("");
+    handleCreateComment: (content, replyTo) => {
+      type === "edit" && (callbacks == null || callbacks.post(content, replyTo));
     },
     handleModifyComment: (commentId) => {
       setEditCommentId(commentId);
@@ -57,7 +53,7 @@ const useComments = ({
       })), setEditCommentId(null));
     },
     handleReset: () => {
-      setContent(""), editCommentId && setEditCommentId(null);
+      editCommentId && setEditCommentId(null);
     }
   };
 };

package/dist/modules/comments/hooks/useCommentsContext.d.ts

@@ -1,6 +1,5 @@
 export declare const useCommentsContext: () => {
     comments: import('../types').CommentProps[] | undefined;
-    content: string;
     editCommentId: string | null;
     profiles: (import('../types').UserProfileResult | undefined)[];
     options: Partial<import('../types').CommentOptions>;
@@ -8,8 +7,7 @@ export declare const useCommentsContext: () => {
     userRights?: Record<import('@edifice.io/client').RightRole, boolean>;
     setEditCommentId: (value: string | null) => void;
     handleModifyComment: (commentId: string) => void;
-    handleChangeContent: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
-    handleCreateComment: (content: string) => void;
+    handleCreateComment: (content: string, replyTo?: string) => void;
     handleUpdateComment: (comment: string) => void;
     handleDeleteComment: (id: string) => void;
     handleReset: () => void;

package/dist/modules/comments/provider/CommentProvider.js

@@ -3,7 +3,7 @@ import { useMemo } from "react";
 import { CommentForm } from "../components/CommentForm.js";
 import { CommentHeader } from "../components/CommentHeader.js";
 import { CommentList } from "../components/CommentList.js";
-import { DEFAULT_MAX_REPLIES, DEFAULT_ADD_COMMENTS, DEFAULT_MAX_COMMENTS, DEFAULT_MAX_REPLY_LENGTH, DEFAULT_MAX_COMMENT_LENGTH } from "../constants.js";
+import { DEFAULT_ADD_REPLIES, DEFAULT_MAX_REPLIES, DEFAULT_ADD_COMMENTS, DEFAULT_MAX_COMMENTS, DEFAULT_MAX_REPLY_LENGTH, DEFAULT_MAX_COMMENT_LENGTH } from "../constants.js";
 import { CommentContext } from "../context/Context.js";
 import { useComments } from "../hooks/useComments.js";
 import Button from "../../../components/Button/Button.js";
@@ -19,12 +19,12 @@ const CommentProvider = ({
     maxComments: DEFAULT_MAX_COMMENTS,
     additionalComments: DEFAULT_ADD_COMMENTS,
     maxReplies: DEFAULT_MAX_REPLIES,
+    additionalReplies: DEFAULT_ADD_REPLIES,
     ...commentOptions
   }, {
     type
   } = props, {
     profilesQueries,
-    content,
     title,
     user,
     emptyscreenPath,
@@ -35,7 +35,6 @@ const CommentProvider = ({
     commentsCount,
     t,
     handleMoreComments,
-    handleChangeContent,
     handleDeleteComment,
     handleCreateComment,
     handleModifyComment,
@@ -49,7 +48,6 @@ const CommentProvider = ({
   }), userRights = type === "edit" ? props.rights : void 0, values = useMemo(
     () => ({
       comments,
-      content,
       profiles: profilesQueries.data,
       editCommentId,
       options,
@@ -60,11 +58,10 @@ const CommentProvider = ({
       handleModifyComment,
       handleUpdateComment,
       handleDeleteComment,
-      handleReset,
-      handleChangeContent
+      handleReset
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [comments, content, editCommentId, profilesQueries, options]
+    [comments, editCommentId, profilesQueries, options]
   );
   return /* @__PURE__ */ jsx(CommentContext.Provider, { value: values, children: /* @__PURE__ */ jsxs("div", { className: "my-24", children: [
     /* @__PURE__ */ jsx(CommentHeader, { title }),

package/dist/modules/comments/types.d.ts

@@ -24,13 +24,18 @@ export interface CommentProps {
      * Date when comment was updated
      */
     updatedAt?: number;
+    /**
+     * The comment parent ID.
+     */
+    replyTo?: string;
 }
 export interface CommentCallbacks {
     /**
      * Method to create a new comment
      * Get the new comment in the callback function
+     * If replyTo is provided, it is a reply to a comment
      */
-    post: (comment: string) => Promise<void>;
+    post: (comment: string, replyTo?: string) => Promise<void>;
     /**
      * Method to update a comment
      * Get the comment and commentId in the callback function
@@ -91,6 +96,10 @@ export type CommentOptions = {
      * Limit on displaying replies to a comment
      */
     maxReplies: number;
+    /**
+     * Number of replies to load additionally in the limited list
+     */
+    additionalReplies: number;
 };
 export interface UserProfileResult {
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edifice.io/react",
-  "version": "2.1.2-develop-pedago.20250305164234",
+  "version": "2.1.2-develop-pedago.20250317171843",
   "description": "Edifice React Library",
   "keywords": [
     "react",
@@ -118,9 +118,9 @@
     "react-slugify": "^3.0.3",
     "swiper": "^10.1.0",
     "ua-parser-js": "^1.0.36",
-    "@edifice.io/bootstrap": "2.1.2-develop-pedago.20250305164234",
-    "@edifice.io/tiptap-extensions": "2.1.2-develop-pedago.20250305164234",
-    "@edifice.io/utilities": "2.1.2-develop-pedago.20250305164234"
+    "@edifice.io/bootstrap": "2.1.2-develop-pedago.20250317171843",
+    "@edifice.io/tiptap-extensions": "2.1.2-develop-pedago.20250317171843",
+    "@edifice.io/utilities": "2.1.2-develop-pedago.20250317171843"
   },
   "devDependencies": {
     "@babel/plugin-transform-react-pure-annotations": "^7.23.3",
@@ -151,8 +151,8 @@
     "vite": "^5.4.11",
     "vite-plugin-dts": "^4.1.0",
     "vite-tsconfig-paths": "^5.0.1",
-    "@edifice.io/client": "2.1.2-develop-pedago.20250305164234",
-    "@edifice.io/config": "2.1.2-develop-pedago.20250305164234"
+    "@edifice.io/client": "2.1.2-develop-pedago.20250317171843",
+    "@edifice.io/config": "2.1.2-develop-pedago.20250317171843"
   },
   "peerDependencies": {
     "@react-spring/web": "^9.7.5",