From 447670bc92ecee1aa2cfe99eded1705848117af1 Mon Sep 17 00:00:00 2001
From: Pavel Prichodko <14926950+prichodko@users.noreply.github.com>
Date: Mon, 23 Jan 2023 15:42:47 +0100
Subject: [PATCH] fix reactions

---
 packages/components/src/button/button.tsx     |  2 +-
 .../src/messages/components/reactions.tsx     | 27 ++++++++++++-------
 2 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/packages/components/src/button/button.tsx b/packages/components/src/button/button.tsx
index 410c28dc..6f07a2da 100644
--- a/packages/components/src/button/button.tsx
+++ b/packages/components/src/button/button.tsx
@@ -90,7 +90,7 @@ const ButtonText = styled(Paragraph, {
 type BaseProps = GetProps<typeof Base>
 
 type Props = BaseProps & {
-  children: string
+  children?: string
   icon?: React.ReactNode
   type?: BaseProps['type']
   size?: BaseProps['size']
diff --git a/packages/components/src/messages/components/reactions.tsx b/packages/components/src/messages/components/reactions.tsx
index 66988263..f7da6bb4 100644
--- a/packages/components/src/messages/components/reactions.tsx
+++ b/packages/components/src/messages/components/reactions.tsx
@@ -2,7 +2,7 @@ import { cloneElement } from 'react'
 
 import { AddReactionIcon } from '@status-im/icons/20'
 import {
-  AngryIcon,
+  // AngryIcon,
   LaughIcon,
   LoveIcon,
   SadIcon,
@@ -51,27 +51,35 @@ const ReactButton = styled(Stack, {
   } as const,
 })
 
-interface Props {
+type ReactionButtonProps = {
   icon: React.ReactElement
-  count: number
+  count?: number
   selected?: boolean
 }
 
-const ReactionButton = (props: Props) => {
+const ReactionButton = (props: ReactionButtonProps) => {
   const { count, selected, icon } = props
 
   return (
     <ReactButton selected={selected}>
       {cloneElement(icon, { color: '$neutral-100' })}
-      <Paragraph weight="medium" variant="smaller" whiteSpace="nowrap">
-        {count}
-      </Paragraph>
+      {count && (
+        <Paragraph weight="medium" variant="smaller" whiteSpace="nowrap">
+          {count}
+        </Paragraph>
+      )}
     </ReactButton>
   )
 }
 
+type Props = {
+  reactions?: any[]
+}
+
 export const Reactions = (props: Props) => {
-  const {} = props
+  const { reactions } = props
+
+  console.log(reactions)
 
   return (
     <XStack space={8}>
@@ -80,7 +88,8 @@ export const Reactions = (props: Props) => {
       <ReactionButton count={99} icon={<ThumbsDownIcon />} />
       <ReactionButton count={100} icon={<LaughIcon />} />
       <ReactionButton count={100} icon={<SadIcon />} />
-      <ReactionButton count={100} icon={<AngryIcon />} />
+      {/* FIX TAMAGUI BUG */}
+      {/* <ReactionButton count={100} icon={<AngryIcon />} /> */}
       <ReactionButton icon={<AddReactionIcon />} />
     </XStack>
   )