This commit is contained in:
Shusui MOYATANI
2023-05-14 15:06:40 +09:00
parent 88cc1c9bc8
commit 9ed589dcd2
2 changed files with 38 additions and 13 deletions

View File

@@ -112,6 +112,7 @@ const TextNoteDisplay: Component<TextNoteDisplayProps> = (props) => {
reactions,
reactionsGroupedByContent,
isReactedBy,
isReactedByWithEmoji,
invalidateReactions,
query: reactionsQuery,
} = useReactions(() => ({
@@ -220,6 +221,10 @@ const TextNoteDisplay: Component<TextNoteDisplayProps> = (props) => {
const p = pubkey();
return (p != null && isReactedBy(p)) || reacted();
});
const isReactedByMeWithEmoji = createMemo(() => {
const p = pubkey();
return p != null && isReactedByWithEmoji(p);
});
const isRepostedByMe = createMemo(() => {
const p = pubkey();
return (p != null && isRepostedBy(p)) || reposted();
@@ -429,8 +434,10 @@ const TextNoteDisplay: Component<TextNoteDisplayProps> = (props) => {
<div
class="flex shrink-0 items-center gap-1"
classList={{
'text-zinc-400': !isReactedByMe(),
'text-rose-400': isReactedByMe() || publishReactionMutation.isLoading,
'text-zinc-400': !isReactedByMe() || isReactedByMeWithEmoji(),
'text-rose-400':
(isReactedByMe() && !isReactedByMeWithEmoji()) ||
publishReactionMutation.isLoading,
}}
>
<button
@@ -438,7 +445,10 @@ const TextNoteDisplay: Component<TextNoteDisplayProps> = (props) => {
onClick={handleReaction}
disabled={publishReactionMutation.isLoading}
>
<Show when={isReactedByMe()} fallback={<HeartOutlined />}>
<Show
when={isReactedByMe() && !isReactedByMeWithEmoji()}
fallback={<HeartOutlined />}
>
<HeartSolid />
</Show>
</button>
@@ -451,7 +461,15 @@ const TextNoteDisplay: Component<TextNoteDisplayProps> = (props) => {
</Show>
</div>
<Show when={config().useEmojiReaction}>
<div class="shrink-0">
<div
class="flex shrink-0 items-center gap-1"
classList={{
'text-zinc-400': !isReactedByMe() || !isReactedByMeWithEmoji(),
'text-rose-400':
(isReactedByMe() && isReactedByMeWithEmoji()) ||
publishReactionMutation.isLoading,
}}
>
<EmojiPicker onEmojiSelect={(emoji) => doReaction(emoji)}>
<span class="inline-block h-4 w-4">
<Plus />