diff --git a/website/src/components/Messages/MessageEmojiButton.stories.tsx b/website/src/components/Messages/MessageEmojiButton.stories.tsx
index b083c966..5d3e8be6 100644
--- a/website/src/components/Messages/MessageEmojiButton.stories.tsx
+++ b/website/src/components/Messages/MessageEmojiButton.stories.tsx
@@ -11,17 +11,16 @@ export default {
const Template = ({
emoji,
count,
- checked,
- showCount,
+ ...rest
}: {
emoji: string;
count: number;
checked?: boolean;
- showCount: boolean;
+ userIsAuthor: boolean;
+ disabled?: boolean;
+ userReacted: boolean;
}) => {
- return (
-
- );
+ return ;
};
export const Default = Template.bind({});
@@ -29,7 +28,9 @@ Default.args = {
emoji: "+1",
count: 7,
checked: false,
- showCount: true,
+ userIsAuthor: false,
+ disabled: false,
+ userReacted: true,
};
export const BigNumber = Template.bind({});
diff --git a/website/src/components/Messages/MessageEmojiButton.tsx b/website/src/components/Messages/MessageEmojiButton.tsx
index f140a789..e3acb3c0 100644
--- a/website/src/components/Messages/MessageEmojiButton.tsx
+++ b/website/src/components/Messages/MessageEmojiButton.tsx
@@ -1,4 +1,5 @@
import { Button } from "@chakra-ui/react";
+import { useHasRole } from "src/hooks/auth/useHasRole";
import { MessageEmoji } from "src/types/Conversation";
import { emojiIcons } from "src/types/Emoji";
@@ -6,12 +7,27 @@ interface MessageEmojiButtonProps {
emoji: MessageEmoji;
checked?: boolean;
onClick: () => void;
- showCount: boolean;
+ userIsAuthor: boolean;
+ disabled?: boolean;
+ userReacted: boolean;
}
-export const MessageEmojiButton = ({ emoji, checked, onClick, showCount }: MessageEmojiButtonProps) => {
+export const MessageEmojiButton = ({
+ emoji,
+ checked,
+ onClick,
+ userIsAuthor,
+ disabled,
+ userReacted,
+}: MessageEmojiButtonProps) => {
const EmojiIcon = emojiIcons.get(emoji.name);
- if (!EmojiIcon) return <>>;
+ const isAdmin = useHasRole("admin");
+
+ if (!EmojiIcon) return null;
+
+ const isDisabled = !!(userIsAuthor ? true : disabled);
+ const showCount = (emoji.count > 0 && userReacted) || userIsAuthor || isAdmin;
+
return (
);
};
diff --git a/website/src/components/Messages/MessageTableEntry.tsx b/website/src/components/Messages/MessageTableEntry.tsx
index a82cc50c..c469de70 100644
--- a/website/src/components/Messages/MessageTableEntry.tsx
+++ b/website/src/components/Messages/MessageTableEntry.tsx
@@ -116,7 +116,8 @@ export function MessageTableEntry({ message, enabled, highlight }: MessageTableE
key={emoji}
emoji={{ name: emoji, count }}
checked={emojiState.user_emojis.includes(emoji)}
- showCount={emojiState.user_emojis.filter((emoji) => emoji === "+1" || emoji === "-1").length > 0}
+ userReacted={emojiState.user_emojis.length > 0}
+ userIsAuthor={message.user_is_author}
onClick={() => react(emoji, !emojiState.user_emojis.includes(emoji))}
/>
);
diff --git a/website/src/types/Conversation.ts b/website/src/types/Conversation.ts
index 5eb86351..89713107 100644
--- a/website/src/types/Conversation.ts
+++ b/website/src/types/Conversation.ts
@@ -19,6 +19,14 @@ export interface Message extends MessageEmojis {
parent_id: string;
frontend_message_id?: string;
user_id: string;
+ user_is_author: boolean | null;
+ deleted: boolean | null;
+ synthetic: boolean | null;
+ message_tree_id: string;
+ ranking_count: number | null;
+ rank: number | null;
+ model_name: string | null;
+ review_count: number | null;
}
export interface Conversation {