From 33143811a06c9195a26507306a1b5bb7b60d3f0a Mon Sep 17 00:00:00 2001 From: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> Date: Mon, 28 Aug 2023 18:56:11 +0300 Subject: [PATCH 1/3] Fix post preview (#197) --- src/NestedDiscussions/Compose.jsx | 2 +- src/Posts/Compose.jsx | 2 +- src/Posts/Edit.jsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/NestedDiscussions/Compose.jsx b/src/NestedDiscussions/Compose.jsx index 9067eccc..d275e0b8 100644 --- a/src/NestedDiscussions/Compose.jsx +++ b/src/NestedDiscussions/Compose.jsx @@ -349,7 +349,7 @@ return ( {state.showPreview ? ( Date: Mon, 28 Aug 2023 18:57:49 +0300 Subject: [PATCH 2/3] Add `disabled` to FlagButton (#194) --- src/AccountProfileOverlay.jsx | 9 +++-- src/Comments/Comment.jsx | 1 + src/FlagButton.jsx | 65 +++++++++++++++++++------------ src/NestedDiscussions/Preview.jsx | 1 + src/Posts/Post.jsx | 1 + src/v1/Posts/Post.jsx | 1 + 6 files changed, 50 insertions(+), 28 deletions(-) diff --git a/src/AccountProfileOverlay.jsx b/src/AccountProfileOverlay.jsx index a0668831..21d6f7b8 100644 --- a/src/AccountProfileOverlay.jsx +++ b/src/AccountProfileOverlay.jsx @@ -37,7 +37,8 @@ const Card = styled.div` const FollowButtonWrapper = styled.div` width: 100%; - div, button { + div, + button { width: 100%; } `; @@ -61,6 +62,7 @@ const overlay = ( src="${REPL_ACCOUNT}/widget/FlagButton" props={{ item: contentModerationItem, + disabled: !context.accountId || context.accountId === accountId, onFlag: () => { State.update({ hasBeenFlagged: true }); }, @@ -110,12 +112,13 @@ return ( props={{ type: "info", title: "Flagged for moderation", - description: "Thanks for helping our Content Moderators. The item you flagged will be reviewed.", + description: + "Thanks for helping our Content Moderators. The item you flagged will be reviewed.", open: state.hasBeenFlagged, onOpenChange: (open) => { State.update({ hasBeenFlagged: open }); }, - duration: 10000 + duration: 10000, }} /> )} diff --git a/src/Comments/Comment.jsx b/src/Comments/Comment.jsx index afbc6933..e5ca1f9b 100644 --- a/src/Comments/Comment.jsx +++ b/src/Comments/Comment.jsx @@ -231,6 +231,7 @@ return ( path: `${accountId}/post/comment`, blockHeight, }, + disabled: !context.accountId || context.accountId === accountId, onFlag: () => { State.update({ hasBeenFlagged: true }); }, diff --git a/src/FlagButton.jsx b/src/FlagButton.jsx index 59ae2834..2e2fd877 100644 --- a/src/FlagButton.jsx +++ b/src/FlagButton.jsx @@ -1,4 +1,4 @@ -const { item } = props; +const { item, disabled } = props; const Button = styled.button` border: 0; @@ -24,36 +24,51 @@ const Button = styled.button` outline: none; color: #11181c; } + + &[disabled] { + color: var(--sand8); + cursor: initial; + } `; +const FlagButton = () => ( + +); + +if (disabled) { + return ( + + ); +} + return ( Flag for moderation} > - + ); diff --git a/src/NestedDiscussions/Preview.jsx b/src/NestedDiscussions/Preview.jsx index 8256fc7f..738015ea 100644 --- a/src/NestedDiscussions/Preview.jsx +++ b/src/NestedDiscussions/Preview.jsx @@ -187,6 +187,7 @@ return ( path: `${accountId}/discuss`, blockHeight, }, + disabled: !context.accountId || context.accountId === accountId, onFlag: () => { State.update({ hasBeenFlagged: true }); }, diff --git a/src/Posts/Post.jsx b/src/Posts/Post.jsx index 5c60b362..affe0202 100644 --- a/src/Posts/Post.jsx +++ b/src/Posts/Post.jsx @@ -333,6 +333,7 @@ return ( src="${REPL_ACCOUNT}/widget/FlagButton" props={{ item, + disabled: !context.accountId || context.accountId === accountId, onFlag: () => { State.update({ hasBeenFlagged: true }); }, diff --git a/src/v1/Posts/Post.jsx b/src/v1/Posts/Post.jsx index b355869a..90b95667 100644 --- a/src/v1/Posts/Post.jsx +++ b/src/v1/Posts/Post.jsx @@ -208,6 +208,7 @@ return ( src="${REPL_ACCOUNT}/widget/FlagButton" props={{ item, + disabled: !context.accountId || context.accountId === accountId, onFlag: () => { State.update({ hasBeenFlagged: true }); }, From 0e846feb0837fd69276f89913c98c507e0815aaf Mon Sep 17 00:00:00 2001 From: Roshaan Siddiqui Date: Mon, 28 Aug 2023 17:35:53 +0200 Subject: [PATCH 3/3] fixes like button --- src/Comments/Comment.jsx | 2 +- src/Feed/Post.jsx | 2 +- src/Posts/Post.jsx | 2 +- src/v1/LikeButton.jsx | 108 +++++++++++++++++++++++++++++++++++++++ src/v1/Posts/Post.jsx | 2 +- 5 files changed, 112 insertions(+), 4 deletions(-) create mode 100644 src/v1/LikeButton.jsx diff --git a/src/Comments/Comment.jsx b/src/Comments/Comment.jsx index afbc6933..01aa7cae 100644 --- a/src/Comments/Comment.jsx +++ b/src/Comments/Comment.jsx @@ -193,7 +193,7 @@ return ( {blockHeight !== "now" && ( { + if (like.value.type === "like") { + likesByUsers[like.accountId] = like; + } else if (like.value.type === "unlike") { + delete likesByUsers[like.accountId]; + } +}); +if (state.hasLike === true) { + likesByUsers[context.accountId] = { + accountId: context.accountId, + }; +} else if (state.hasLike === false) { + delete likesByUsers[context.accountId]; +} + +const accountsWithLikes = Object.keys(likesByUsers); +const hasLike = context.accountId && !!likesByUsers[context.accountId]; +const totalLikes = accountsWithLikes.length; + +const LikeButton = styled.button` + border: 0 !important; + display: inline-flex; + align-items: center; + justify-content: center; + border-radius: 50%; + width: 2.5em; + height: 2.5em; + &:hover { + color: red; + background: pink; + } + .bi-heart-fill { + color: red; + } +`; + +const likeClick = () => { + if (state.loading) { + return; + } + State.update({ + loading: true, + }); + const data = { + index: { + like: JSON.stringify({ + key: item, + value: { + type: hasLike ? "unlike" : "like", + }, + }), + }, + }; + + if (!hasLike && props.notifyAccountId) { + data.index.notify = JSON.stringify({ + key: props.notifyAccountId, + value: { + type: "like", + item, + }, + }); + } + Social.set(data, { + onCommit: () => State.update({ loading: false, hasLike: !hasLike }), + onCancel: () => State.update({ loading: false }), + }); +}; + +const title = hasLike ? "Unlike" : "Like"; + +return ( +
+ + {state.loading || dataLoading ? ( + + {totalLikes == 0 ? ( + "0" + ) : ( + + )} +
+); diff --git a/src/v1/Posts/Post.jsx b/src/v1/Posts/Post.jsx index b355869a..68784126 100644 --- a/src/v1/Posts/Post.jsx +++ b/src/v1/Posts/Post.jsx @@ -178,7 +178,7 @@ return ( {blockHeight !== "now" && (