@hhgtech/hhg-components 1.29.254 → 1.29.255-beta-2

package/build/{index-63768ff9.js → index-c8ebbc07.js}

@@ -1,34 +1,34 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var React = require('react');
-var index$6 = require('./index-59ad8a4c.js');
-var index$3 = require('./index-9e0dc55b.js');
-var index = require('./index-acff76f5.js');
+var index$6 = require('./index-c83c67dc.js');
+var index$3 = require('./index-ff6f20f3.js');
+var index = require('./index-5ca7e3cf.js');
 var innertext = require('innertext');
-var index$1 = require('./index-769d63e8.js');
-var index$2 = require('./index-b27dea68.js');
-var constants = require('./constants-ab46e8d8.js');
-var togetherApiPaths = require('./togetherApiPaths.js');
-var togetherComponentGlobalContext = require('./utils-f446154c.js');
+var index$1 = require('./index-72ee30dd.js');
+var index$2 = require('./index-b4639f39.js');
+var constants = require('./constants-1a9f28f9.js');
 var useTogetherAuthRequiredAction = require('./useTogetherAuthRequiredAction.js');
-var treePopoverMenu = require('./treePopoverMenu-073862f5.js');
+var togetherComponentGlobalContext = require('./utils-ff0f9884.js');
+var treePopoverMenu = require('./treePopoverMenu-fdfcd067.js');
 var styled = require('@emotion/styled');
-var utils = require('./utils-88ba9396.js');
+var utils = require('./utils-79522a9e.js');
 var miscTheme = require('./miscTheme.js');
-var dataTransform = require('./dataTransform-6ed700b2.js');
-var index$8 = require('./index-c3b93ec8.js');
-var togetherMoleculesCardAuthor = require('./index-e3d90690.js');
-var togetherMoleculesProfileDetail = require('./index-331f4771.js');
-var togetherMoleculesPostImagePreview = require('./index-b5dc2b35.js');
-var index$7 = require('./index-2d574258.js');
-require('./index-93e13cbe.js');
+var dataTransform = require('./dataTransform-73e5b86d.js');
+var togetherApiPaths = require('./togetherApiPaths.js');
+var index$8 = require('./index-160990b1.js');
+var togetherMoleculesCardAuthor = require('./index-b7cb4d31.js');
+var togetherMoleculesProfileDetail = require('./index-5f078e18.js');
+var togetherMoleculesPostImagePreview = require('./index-de9feacd.js');
+var index$7 = require('./index-d09c6f4c.js');
+require('./index-a14c3067.js');
 var core$1 = require('@hhgtech/icons/core');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
-var index$5 = require('./index-6cf2534d.js');
-var index$4 = require('./index-6351607e.js');
-var normalizeLink = require('./normalizeLink-81ac71ed.js');
+var index$5 = require('./index-6251d476.js');
+var index$4 = require('./index-79fba52e.js');
+var normalizeLink = require('./normalizeLink-584effeb.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -37,31 +37,29 @@ var React__default = /*#__PURE__*/_interopDefault(React);
 var innertext__default = /*#__PURE__*/_interopDefault(innertext);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 
-var img$8 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath fill='%233E3F58' d='M5 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2M19 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2'/%3e%3c/svg%3e";
-var MBMoreSolid = img$8;
-
-var img$7 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23595959'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M12 13.333 8 10.37l-4 2.963V3.852c0-.314.12-.616.335-.838.214-.222.505-.347.808-.347h5.714c.303 0 .594.125.808.347s.335.524.335.838z'/%3e%3c/svg%3e";
-var IconBookmarkFill = img$7;
+var img$7 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath fill='%233E3F58' d='M5 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2M19 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2M12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2'/%3e%3c/svg%3e";
+var MBMoreSolid = img$7;
 
-var img$6 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M12 13.333 8 10.37l-4 2.963V3.852c0-.314.12-.616.335-.838.214-.222.505-.347.808-.347h5.714c.303 0 .594.125.808.347s.335.524.335.838z'/%3e%3c/svg%3e";
-var IconBookmark = img$6;
+var img$6 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='3' height='13' fill='none'%3e%3ccircle cx='1.583' cy='6.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 6.417)'/%3e%3ccircle cx='1.583' cy='1.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 1.417)'/%3e%3ccircle cx='1.583' cy='11.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 11.417)'/%3e%3c/svg%3e";
+var IconKebab = img$6;
 
-var img$5 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='3' height='13' fill='none'%3e%3ccircle cx='1.583' cy='6.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 6.417)'/%3e%3ccircle cx='1.583' cy='1.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 1.417)'/%3e%3ccircle cx='1.583' cy='11.417' r='1.25' fill='%23595959' transform='rotate(90 1.583 11.417)'/%3e%3c/svg%3e";
-var IconKebab = img$5;
+var img$5 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M7.17 3.236H2.995a1.193 1.193 0 0 0-1.193 1.192v8.35a1.193 1.193 0 0 0 1.193 1.192h8.35a1.193 1.193 0 0 0 1.192-1.192V8.603'/%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M11.643 2.341a1.265 1.265 0 0 1 1.789 1.79L7.766 9.795l-2.385.596.596-2.385z'/%3e%3c/svg%3e";
+var IconTabEdit = img$5;
 
-var img$4 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M12 5.333a2 2 0 1 0 0-4 2 2 0 0 0 0 4M4 10a2 2 0 1 0 0-4 2 2 0 0 0 0 4M12 14.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4M5.727 9.007l4.553 2.653M10.273 4.34 5.727 6.993'/%3e%3c/svg%3e";
-var IconShareOnMedia = img$4;
-
-var img$3 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M7.17 3.236H2.995a1.193 1.193 0 0 0-1.193 1.192v8.35a1.193 1.193 0 0 0 1.193 1.192h8.35a1.193 1.193 0 0 0 1.192-1.192V8.603'/%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M11.643 2.341a1.265 1.265 0 0 1 1.789 1.79L7.766 9.795l-2.385.596.596-2.385z'/%3e%3c/svg%3e";
-var IconTabEdit = img$3;
-
-var img$2 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='M2 4h12'/%3e%3cpath stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M5.333 4V2.667a1.333 1.333 0 0 1 1.334-1.334h2.666a1.334 1.334 0 0 1 1.334 1.334V4m2 0v9.333a1.334 1.334 0 0 1-1.334 1.334H4.667a1.334 1.334 0 0 1-1.334-1.334V4zM6.667 7.333v4M9.333 7.333v4'/%3e%3c/svg%3e";
-var IconTrashBin = img$2;
+var img$4 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.75' d='M2 4h12'/%3e%3cpath stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M5.333 4V2.667a1.333 1.333 0 0 1 1.334-1.334h2.666a1.334 1.334 0 0 1 1.334 1.334V4m2 0v9.333a1.334 1.334 0 0 1-1.334 1.334H4.667a1.334 1.334 0 0 1-1.334-1.334V4zM6.667 7.333v4M9.333 7.333v4'/%3e%3c/svg%3e";
+var IconTrashBin = img$4;
 
 // import IconBellOff from '../../../assets/svg/icon-bell-off.svg'
 // import IconBellOn from '../../../assets/svg/icon-bell-on.svg'
-const CardPostPopoverMore = ({ authorEmail, onDeletePost, shareUrl, post, className = '', popoverClassName = '', onBookmark, onRemoveBookmark, onEditPost, }) => {
-    const { data: { locale, userInfo, togetherUserId, env: { isMarryBaby }, }, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
+const CardPostPopoverMore = ({ authorEmail, onDeletePost, shareUrl, post, className = '', popoverClassName = '', 
+// onBookmark,
+// onRemoveBookmark,
+onEditPost, }) => {
+    const { data: { locale, userInfo, 
+    // togetherUserId,
+    env: { isMarryBaby }, },
+    // action: { pushNotifications },
+     } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const { t } = index.useTranslations();
     // const [localHasNoti, setLocalHasNoti] = useState(false)
     const [loading, setLoading] = React.useState(false);
@@ -96,11 +94,11 @@ const CardPostPopoverMore = ({ authorEmail, onDeletePost, shareUrl, post, classN
                     isShowheader: false,
                     type: 'list',
                     list: [
-                        {
-                            icon: IconShareOnMedia,
-                            label: t('morePopover.share'),
-                            onClick: () => setIsOpenSharePopup(true),
-                        },
+                        // {
+                        //   icon: IconShareOnMedia,
+                        //   label: t('morePopover.share'),
+                        //   onClick: () => setIsOpenSharePopup(true),
+                        // },
                         {
                             icon: IconTabEdit,
                             label: t('actionPopover.edit'),
@@ -119,76 +117,80 @@ const CardPostPopoverMore = ({ authorEmail, onDeletePost, shareUrl, post, classN
                     isShowheader: false,
                     type: 'list',
                     list: [
-                        {
-                            icon: IconShareOnMedia,
-                            label: t('morePopover.share'),
-                            onClick: () => setIsOpenSharePopup(true),
-                        },
-                        {
-                            icon: !!(post === null || post === void 0 ? void 0 : post.bookmarked) ? IconBookmarkFill : IconBookmark,
-                            label: !!(post === null || post === void 0 ? void 0 : post.bookmarked)
-                                ? t('morePopover.unsavePost')
-                                : t('morePopover.savePost'),
-                            onClick: () => {
-                                authActionWrapper(() => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-                                    if (!(userInfo === null || userInfo === void 0 ? void 0 : userInfo.id) || !(post === null || post === void 0 ? void 0 : post.id))
-                                        return;
-                                    if (post === null || post === void 0 ? void 0 : post.bookmarked) {
-                                        const res = yield togetherComponentGlobalContext.callApiWithAuth(togetherComponentGlobalContext.getApiPath(togetherApiPaths.PATHS.BOOKMARK.DELETE, {
-                                            _locale: locale,
-                                        }), 'DELETE', {
-                                            data: {
-                                                post_id: String(post.id),
-                                            },
-                                        });
-                                        if ((res === null || res === void 0 ? void 0 : res.status) === 1) {
-                                            pushNotifications({
-                                                title: '',
-                                                message: 'Removed saved post',
-                                                type: 'success',
-                                                displayIcon: IconBookmark,
-                                            });
-                                            onRemoveBookmark && onRemoveBookmark();
-                                        }
-                                        else {
-                                            pushNotifications({
-                                                title: '',
-                                                message: 'Remove failed',
-                                                type: 'danger',
-                                                displayIcon: IconBookmark,
-                                            });
-                                        }
-                                    }
-                                    else {
-                                        const res = yield togetherComponentGlobalContext.callApiWithAuth(togetherComponentGlobalContext.getApiPath(togetherApiPaths.PATHS.BOOKMARK.CREATE, {
-                                            _locale: locale,
-                                        }), 'POST', {
-                                            data: {
-                                                user_id: togetherUserId || userInfo.id,
-                                                post_id: post.id,
-                                            },
-                                        });
-                                        if ((res === null || res === void 0 ? void 0 : res.status) === 1) {
-                                            pushNotifications({
-                                                title: '',
-                                                message: 'Post saved',
-                                                type: 'success',
-                                                displayIcon: IconBookmarkFill,
-                                            });
-                                            onBookmark && onBookmark();
-                                        }
-                                        else {
-                                            pushNotifications({
-                                                title: '',
-                                                message: 'Post saved failed',
-                                                type: 'danger',
-                                                displayIcon: IconBookmark,
-                                            });
-                                        }
-                                    }
-                                }));
-                            },
-                        },
+                        // {
+                        //   icon: IconShareOnMedia,
+                        //   label: t('morePopover.share'),
+                        //   onClick: () => setIsOpenSharePopup(true),
+                        // },
+                        // {
+                        //   icon: !!post?.bookmarked ? IconBookmarkFill : IconBookmark,
+                        //   label: !!post?.bookmarked
+                        //     ? t('morePopover.unsavePost')
+                        //     : t('morePopover.savePost'),
+                        //   onClick: () => {
+                        //     authActionWrapper(async () => {
+                        //       if (!userInfo?.id || !post?.id) return
+                        //       if (post?.bookmarked) {
+                        //         const res = await callApiWithAuth(
+                        //           getApiPath(PATHS.BOOKMARK.DELETE, {
+                        //             _locale: locale,
+                        //           }),
+                        //           'DELETE',
+                        //           {
+                        //             data: {
+                        //               post_id: String(post.id),
+                        //             },
+                        //           },
+                        //         )
+                        //         if (res?.status === 1) {
+                        //           pushNotifications({
+                        //             title: '',
+                        //             message: 'Removed saved post',
+                        //             type: 'success',
+                        //             displayIcon: IconBookmark,
+                        //           })
+                        //           onRemoveBookmark && onRemoveBookmark()
+                        //         } else {
+                        //           pushNotifications({
+                        //             title: '',
+                        //             message: 'Remove failed',
+                        //             type: 'danger',
+                        //             displayIcon: IconBookmark,
+                        //           })
+                        //         }
+                        //       } else {
+                        //         const res = await callApiWithAuth(
+                        //           getApiPath(PATHS.BOOKMARK.CREATE, {
+                        //             _locale: locale,
+                        //           }),
+                        //           'POST',
+                        //           {
+                        //             data: {
+                        //               user_id: togetherUserId || userInfo.id,
+                        //               post_id: post.id,
+                        //             },
+                        //           },
+                        //         )
+                        //         if (res?.status === 1) {
+                        //           pushNotifications({
+                        //             title: '',
+                        //             message: 'Post saved',
+                        //             type: 'success',
+                        //             displayIcon: IconBookmarkFill,
+                        //           })
+                        //           onBookmark && onBookmark()
+                        //         } else {
+                        //           pushNotifications({
+                        //             title: '',
+                        //             message: 'Post saved failed',
+                        //             type: 'danger',
+                        //             displayIcon: IconBookmark,
+                        //           })
+                        //         }
+                        //       }
+                        //     })
+                        //   },
+                        // },
                         // {
                         //   icon: togetherBasePath + '/svg/icon-bell-on.svg',
                         //   label: !localHasNoti
@@ -425,6 +427,12 @@ const StyledCardPost$1 = styled__default["default"].div `
   }
 `;
 
+var img$3 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23595959'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M12 13.333 8 10.37l-4 2.963V3.852c0-.314.12-.616.335-.838.214-.222.505-.347.808-.347h5.714c.303 0 .594.125.808.347s.335.524.335.838z'/%3e%3c/svg%3e";
+var IconBookmarkFill = img$3;
+
+var img$2 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath stroke='%23595959' stroke-linecap='round' stroke-linejoin='round' d='M12 13.333 8 10.37l-4 2.963V3.852c0-.314.12-.616.335-.838.214-.222.505-.347.808-.347h5.714c.303 0 .594.125.808.347s.335.524.335.838z'/%3e%3c/svg%3e";
+var IconBookmark = img$2;
+
 var img$1 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' fill='none'%3e%3cg stroke='%23737373' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' clip-path='url(%23a)'%3e%3cpath d='M2 4.008h12m-8.667 0V2.675a1.333 1.333 0 0 1 1.334-1.333h2.666a1.333 1.333 0 0 1 1.334 1.333v1.333m2 0v9.334a1.333 1.333 0 0 1-1.334 1.333H4.667a1.333 1.333 0 0 1-1.334-1.333V4.008zm-6 3.334v4m2.666-4v4'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='a'%3e%3cpath fill='white' d='M0 .008h16v16H0z'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e";
 var IconDelete = img$1;
 
@@ -1192,12 +1200,13 @@ const getMostEngagingComment = (postId, locale) => tslib_es6.__awaiter(void 0, v
     }), 'GET');
     return (_c = (_b = (_a = commentsRes === null || commentsRes === void 0 ? void 0 : commentsRes.data) === null || _a === void 0 ? void 0 : _a.comments) === null || _b === void 0 ? void 0 : _b.map(dataTransform.formatComment)) === null || _c === void 0 ? void 0 : _c[0];
 });
-const CardPost = ({ className, style, hideViewMoreComment, showMostEngaging, onCommentClick, onCommentCountClick, onMostEngagingCommentClick, onPostCommentSuccess: onPostCommentSuccessProp, disableCardLink, disableShortenContent, onDeletePost, onEditPost, post: postProp, mostEngagingComment: mostEngagingCommentProp, onDeleteComment: onDeleteCommentProp, showInputComment: propsShowInputComment, InlineCommentsComponent, hasQuickBookingEnable, handleMakeAppointment, cardAuthorProps, }) => {
+const CardPost = ({ className, style, hideViewMoreComment, showMostEngaging, onCommentClick, onCommentCountClick, onMostEngagingCommentClick, onPostCommentSuccess: onPostCommentSuccessProp, disableCardLink, disableShortenContent, onDeletePost, onEditPost, post: postProp, mostEngagingComment: mostEngagingCommentProp, onDeleteComment: onDeleteCommentProp, showInputComment: propsShowInputComment, InlineCommentsComponent, hasQuickBookingEnable, handleMakeAppointment, cardAuthorProps, verticalReactions = false, }) => {
     const [post, setPost] = React.useState(postProp);
     const [isOpenSharePopup, setIsOpenSharePopup] = React.useState(false);
     const [mostEngagingComment, setMostEngagingComment] = React.useState(mostEngagingCommentProp);
     const { community, topics, author, slug, isPin, liked, photos, mentions, title, description, previewUrl, likesCount, commentsCount, id, commented, } = post;
-    const { data: { locale, env: { isMarryBaby, togetherBasePath }, }, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
+    const { data: { locale, togetherUserId, userInfo, env: { isMarryBaby, togetherBasePath }, }, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
+    const isLoggedIn = Boolean(userInfo === null || userInfo === void 0 ? void 0 : userInfo.id);
     const { t } = index.useTranslations();
     const [showInputComment, setShowInputComment] = React.useState(propsShowInputComment);
     const postRelativeHref = `${togetherBasePath}/${(community === null || community === void 0 ? void 0 : community.slug) || '_'}/${slug || ''}`;
@@ -1308,7 +1317,7 @@ const CardPost = ({ className, style, hideViewMoreComment, showMostEngaging, onC
                 React__default["default"].createElement(togetherMoleculesPostImagePreview.PostImagePreview, { images: photos, authorName: author === null || author === void 0 ? void 0 : author.name }))) : null),
             React__default["default"].createElement("div", { key: "link-preview" }, !(post === null || post === void 0 ? void 0 : post.introUrl) && !(photos === null || photos === void 0 ? void 0 : photos.length) && (previewUrl === null || previewUrl === void 0 ? void 0 : previewUrl.url) ? (React__default["default"].createElement("div", { className: "link-preview-wrapper" },
                 React__default["default"].createElement(index$8.CardLink, { title: previewUrl.title, url: previewUrl.url, image: previewUrl.image }))) : null),
-            React__default["default"].createElement(treePopoverMenu.CardReactions, { isMarryBaby: isMarryBaby, type: treePopoverMenu.CardReactionType.post, loveCount: likesCount, replyCount: commentsCount, className: `post-reaction ${(photos === null || photos === void 0 ? void 0 : photos.length) || (previewUrl === null || previewUrl === void 0 ? void 0 : previewUrl.url) ? 'hide-top-border' : ''}`, liked: isLikeLoading ? !liked : liked, isReplied: commented, onCommentClick: () => authActionWrapper(() => {
+            React__default["default"].createElement(treePopoverMenu.CardReactions, { isMarryBaby: isMarryBaby, type: treePopoverMenu.CardReactionType.post, loveCount: likesCount, replyCount: commentsCount, className: `post-reaction ${(photos === null || photos === void 0 ? void 0 : photos.length) || (previewUrl === null || previewUrl === void 0 ? void 0 : previewUrl.url) ? 'hide-top-border' : ''}`, liked: isLikeLoading ? !liked : liked, isReplied: commented, isSaved: (post === null || post === void 0 ? void 0 : post.bookmarked) || false, onCommentClick: () => authActionWrapper(() => {
                     onCommentClick ? onCommentClick() : setShowInputComment((v) => !v);
                 }), onCommentCountClick: () => {
                     authActionWrapper(() => {
@@ -1321,26 +1330,98 @@ const CardPost = ({ className, style, hideViewMoreComment, showMostEngaging, onC
                 }, onShareClick: () => {
                     setIsOpenSharePopup(true);
                 }, onLikeClick: () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-                    if (!id || isLikeLoading)
-                        return;
-                    setIsLikeLoading(true);
-                    try {
-                        const res = yield index$1.likeUnlikePost({
-                            id,
-                            locale,
-                        });
-                        if ((res === null || res === void 0 ? void 0 : res.status) !== 1) {
+                    authActionWrapper(() => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
+                        if (!id || isLikeLoading)
+                            return;
+                        setIsLikeLoading(true);
+                        try {
+                            const res = yield index$1.likeUnlikePost({
+                                id,
+                                locale,
+                            });
+                            if ((res === null || res === void 0 ? void 0 : res.status) !== 1) {
+                                pushNotifications(index$1.getDefaultFailNoti(t));
+                            }
+                            else {
+                                setPost((p) => (Object.assign(Object.assign({}, p), { likesCount: (p.likesCount || 0) + (!p.liked ? 1 : -1), liked: !p.liked })));
+                            }
+                        }
+                        catch (_a) {
                             pushNotifications(index$1.getDefaultFailNoti(t));
                         }
+                        setIsLikeLoading(false);
+                    }));
+                }), onSaveClick: () => {
+                    authActionWrapper(() => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
+                        if (!(userInfo === null || userInfo === void 0 ? void 0 : userInfo.id) || !(post === null || post === void 0 ? void 0 : post.id))
+                            return;
+                        if (post === null || post === void 0 ? void 0 : post.bookmarked) {
+                            const res = yield togetherComponentGlobalContext.callApiWithAuth(togetherComponentGlobalContext.getApiPath(togetherApiPaths.PATHS.BOOKMARK.DELETE, {
+                                _locale: locale,
+                            }), 'DELETE', {
+                                headers: {
+                                    'Content-Type': 'application/json',
+                                },
+                                data: {
+                                    post_id: String(post.id),
+                                },
+                            });
+                            if ((res === null || res === void 0 ? void 0 : res.status) === 1) {
+                                pushNotifications({
+                                    title: '',
+                                    message: 'Removed saved post',
+                                    type: 'success',
+                                    displayIcon: IconBookmark,
+                                });
+                            }
+                            else {
+                                pushNotifications({
+                                    title: '',
+                                    message: 'Remove failed',
+                                    type: 'danger',
+                                    displayIcon: IconBookmark,
+                                });
+                            }
+                        }
                         else {
-                            setPost((p) => (Object.assign(Object.assign({}, p), { likesCount: (p.likesCount || 0) + (!p.liked ? 1 : -1), liked: !p.liked })));
+                            const res = yield togetherComponentGlobalContext.callApiWithAuth(togetherComponentGlobalContext.getApiPath(togetherApiPaths.PATHS.BOOKMARK.CREATE, {
+                                _locale: locale,
+                            }), 'POST', {
+                                headers: {
+                                    'Content-Type': 'application/json',
+                                },
+                                data: {
+                                    user_id: togetherUserId || userInfo.id,
+                                    post_id: post.id,
+                                },
+                            });
+                            if ((res === null || res === void 0 ? void 0 : res.status) === 1) {
+                                pushNotifications({
+                                    title: '',
+                                    message: 'Post saved',
+                                    type: 'success',
+                                    displayIcon: IconBookmarkFill,
+                                });
+                            }
+                            else {
+                                pushNotifications({
+                                    title: '',
+                                    message: 'Post saved failed',
+                                    type: 'danger',
+                                    displayIcon: IconBookmark,
+                                });
+                            }
                         }
+                    }));
+                }, onGoToUrl: (params) => {
+                    const urlDetailPost = params ? `${postHref}${params}` : postHref;
+                    if (!isLoggedIn) {
+                        authActionWrapper(() => (window.location.href = urlDetailPost));
                     }
-                    catch (_a) {
-                        pushNotifications(index$1.getDefaultFailNoti(t));
+                    else {
+                        window.location.href = urlDetailPost;
                     }
-                    setIsLikeLoading(false);
-                }), showingMostEngaging: !!(showMostEngaging && (mostEngagingComment === null || mostEngagingComment === void 0 ? void 0 : mostEngagingComment.id)) }),
+                }, showingMostEngaging: !!(showMostEngaging && (mostEngagingComment === null || mostEngagingComment === void 0 ? void 0 : mostEngagingComment.id)), isVertical: verticalReactions }),
             showInputComment && (React__default["default"].createElement(index$1.InputCommentBar, { isMainCmt: !propsShowInputComment, onClose: () => setShowInputComment(false), onPostSuccess: onPostCommentSuccess, post: post })),
             showMostEngaging && (mostEngagingComment === null || mostEngagingComment === void 0 ? void 0 : mostEngagingComment.id) ? (React__default["default"].createElement("div", { className: "most-engaging-wrapper", onClick: (e) => {
                     if (onMostEngagingCommentClick) {

package/build/{index-c4db2775.js → index-cab63cde.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var React = require('react');
 var core = require('@mantine/core');
 

package/build/{index-5dc995d6.js → index-d10cca36.js}

@@ -1,26 +1,26 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var index$3 = require('./index-031820fd.js');
-var index$4 = require('./index-5df84f1b.js');
-var index$5 = require('./index-6351607e.js');
-require('./index-c4db2775.js');
-require('./index.styles-0fca29e2.js');
-var index = require('./index-acff76f5.js');
+var index$3 = require('./index-f54b7c33.js');
+var index$4 = require('./index-37aacf75.js');
+var index$5 = require('./index-79fba52e.js');
+require('./index-cab63cde.js');
+require('./index.styles-acab6f44.js');
+var index = require('./index-5ca7e3cf.js');
 require('@mantine/hooks');
-require('./useMantineLocale-64c96485.js');
-require('./index-6bb0ed88.js');
-require('./index-b27dea68.js');
-require('./utils-88ba9396.js');
-require('./index-93e13cbe.js');
-require('./other-1f83bfda.js');
-require('./index-91b42e47.js');
-var constants = require('./constants-7b5c9b12.js');
-var index$1 = require('./index-170adfc7.js');
-var index$2 = require('./index-549a9d0a.js');
+require('./useMantineLocale-995feb60.js');
+require('./index-55eb8874.js');
+require('./index-b4639f39.js');
+require('./utils-79522a9e.js');
+require('./index-a14c3067.js');
+require('./other-3aca54dd.js');
+require('./index-2ed5e004.js');
+var constants = require('./constants-89ab5c82.js');
+var index$1 = require('./index-7b478dd5.js');
+var index$2 = require('./index-b18202e6.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-0f4fe09b.js → index-d395078c.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var React = require('react');
 var styled = require('@emotion/styled');
-var utils = require('./utils-88ba9396.js');
+var utils = require('./utils-79522a9e.js');
 var miscTheme = require('./miscTheme.js');
-var index = require('./index-6cf2534d.js');
+var index = require('./index-6251d476.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-b5dc2b35.js → index-de9feacd.js}

@@ -1,14 +1,14 @@
 'use strict';
 
 var React = require('react');
-var index$2 = require('./index-9e0dc55b.js');
-var utils = require('./utils-88ba9396.js');
-var index = require('./index-acff76f5.js');
-var togetherComponentGlobalContext = require('./utils-f446154c.js');
+var index$2 = require('./index-ff6f20f3.js');
+var utils = require('./utils-79522a9e.js');
+var index = require('./index-5ca7e3cf.js');
+var togetherComponentGlobalContext = require('./utils-ff0f9884.js');
 var core = require('@mantine/core');
-var index$1 = require('./index-6351607e.js');
+var index$1 = require('./index-79fba52e.js');
 var styled = require('@emotion/styled');
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var miscTheme = require('./miscTheme.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
 

package/build/{index-f8494f0a.js → index-dfed79c5.js}

@@ -1,24 +1,24 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-8af68a32.js');
+var tslib_es6 = require('./tslib.es6-ba74242f.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index$2 = require('./index-031820fd.js');
+var index$2 = require('./index-f54b7c33.js');
 require('@mantine/dates');
-var index = require('./index-93e13cbe.js');
-require('./index-6bb0ed88.js');
-require('./index-b27dea68.js');
-require('./useMantineLocale-64c96485.js');
-require('./index-6351607e.js');
-require('./index-c4db2775.js');
-require('./index.styles-0fca29e2.js');
-var index$1 = require('./index-acff76f5.js');
+var index = require('./index-a14c3067.js');
+require('./index-55eb8874.js');
+require('./index-b4639f39.js');
+require('./useMantineLocale-995feb60.js');
+require('./index-79fba52e.js');
+require('./index-cab63cde.js');
+require('./index.styles-acab6f44.js');
+var index$1 = require('./index-5ca7e3cf.js');
 require('@mantine/hooks');
-require('./utils-88ba9396.js');
-require('./other-1f83bfda.js');
-require('./index-91b42e47.js');
-var utils = require('./utils-fd28507d.js');
-var Locale = require('./Locale-3d43dc61.js');
+require('./utils-79522a9e.js');
+require('./other-3aca54dd.js');
+require('./index-2ed5e004.js');
+var utils = require('./utils-c999b93f.js');
+var Locale = require('./Locale-db2e77cb.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-e7f8c511.js → index-e984be60.js}

@@ -2,12 +2,12 @@
 
 var React = require('react');
 var core = require('@mantine/core');
-var utils = require('./utils-88ba9396.js');
+var utils = require('./utils-79522a9e.js');
 var react = require('@emotion/react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var animation = require('./animation-38982abc.js');
-var index = require('./index-6351607e.js');
+var animation = require('./animation-465e46fc.js');
+var index = require('./index-79fba52e.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }