fix reactions
This commit is contained in:
parent
07168dc47c
commit
447670bc92
|
@ -90,7 +90,7 @@ const ButtonText = styled(Paragraph, {
|
||||||
type BaseProps = GetProps<typeof Base>
|
type BaseProps = GetProps<typeof Base>
|
||||||
|
|
||||||
type Props = BaseProps & {
|
type Props = BaseProps & {
|
||||||
children: string
|
children?: string
|
||||||
icon?: React.ReactNode
|
icon?: React.ReactNode
|
||||||
type?: BaseProps['type']
|
type?: BaseProps['type']
|
||||||
size?: BaseProps['size']
|
size?: BaseProps['size']
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { cloneElement } from 'react'
|
||||||
|
|
||||||
import { AddReactionIcon } from '@status-im/icons/20'
|
import { AddReactionIcon } from '@status-im/icons/20'
|
||||||
import {
|
import {
|
||||||
AngryIcon,
|
// AngryIcon,
|
||||||
LaughIcon,
|
LaughIcon,
|
||||||
LoveIcon,
|
LoveIcon,
|
||||||
SadIcon,
|
SadIcon,
|
||||||
|
@ -51,27 +51,35 @@ const ReactButton = styled(Stack, {
|
||||||
} as const,
|
} as const,
|
||||||
})
|
})
|
||||||
|
|
||||||
interface Props {
|
type ReactionButtonProps = {
|
||||||
icon: React.ReactElement
|
icon: React.ReactElement
|
||||||
count: number
|
count?: number
|
||||||
selected?: boolean
|
selected?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
const ReactionButton = (props: Props) => {
|
const ReactionButton = (props: ReactionButtonProps) => {
|
||||||
const { count, selected, icon } = props
|
const { count, selected, icon } = props
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ReactButton selected={selected}>
|
<ReactButton selected={selected}>
|
||||||
{cloneElement(icon, { color: '$neutral-100' })}
|
{cloneElement(icon, { color: '$neutral-100' })}
|
||||||
<Paragraph weight="medium" variant="smaller" whiteSpace="nowrap">
|
{count && (
|
||||||
{count}
|
<Paragraph weight="medium" variant="smaller" whiteSpace="nowrap">
|
||||||
</Paragraph>
|
{count}
|
||||||
|
</Paragraph>
|
||||||
|
)}
|
||||||
</ReactButton>
|
</ReactButton>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
reactions?: any[]
|
||||||
|
}
|
||||||
|
|
||||||
export const Reactions = (props: Props) => {
|
export const Reactions = (props: Props) => {
|
||||||
const {} = props
|
const { reactions } = props
|
||||||
|
|
||||||
|
console.log(reactions)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<XStack space={8}>
|
<XStack space={8}>
|
||||||
|
@ -80,7 +88,8 @@ export const Reactions = (props: Props) => {
|
||||||
<ReactionButton count={99} icon={<ThumbsDownIcon />} />
|
<ReactionButton count={99} icon={<ThumbsDownIcon />} />
|
||||||
<ReactionButton count={100} icon={<LaughIcon />} />
|
<ReactionButton count={100} icon={<LaughIcon />} />
|
||||||
<ReactionButton count={100} icon={<SadIcon />} />
|
<ReactionButton count={100} icon={<SadIcon />} />
|
||||||
<ReactionButton count={100} icon={<AngryIcon />} />
|
{/* FIX TAMAGUI BUG */}
|
||||||
|
{/* <ReactionButton count={100} icon={<AngryIcon />} /> */}
|
||||||
<ReactionButton icon={<AddReactionIcon />} />
|
<ReactionButton icon={<AddReactionIcon />} />
|
||||||
</XStack>
|
</XStack>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue