Something went wrong. Try again.
Bluesky app fork with some witchin' additions 💫
Something went wrong. Try again.
1.9 kB · 58 lines
TSX
at build
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859import Svg, {Ellipse, Path} from 'react-native-svg'
import {useReplyIconIndicators} from '#/state/preferences/reply-icon-indicators'import {type Props, useCommonSVGProps} from '#/components/icons/common'import {Reply as Bubble} from '#/components/icons/Reply'
const replyIcons = [false, true].map(restricted => Array.from({length: 4}, (_, dotCount) => { return function ReplyIcon(props: Props) { const {fill, size, style, gradient, ...rest} = useCommonSVGProps(props)
return ( <Svg fill="none" {...rest} viewBox="0 0 24 24" width={size} height={size} style={style}> {gradient} <Path d="M18 4H6a3 3 0 0 0-3 3v8a3 3 0 0 0 3 3h2v4l5-4h5a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Z" stroke={fill} strokeWidth={2} strokeLinejoin="round" strokeLinecap="round" strokeDasharray={restricted ? '2 3.1' : undefined} /> {Array.from({length: dotCount}, (_, index) => ( <Ellipse key={index} cx={12 - (dotCount - 1) * 2 + index * 4} cy={11} rx={1.25} ry={1.5} fill={fill} /> ))} </Svg> ) } }),)
/** * Indicator artwork for a reply count and gate state. Ignores the * `replyIconIndicators` pref, so use {@link useReplyIcon} instead - the settings * row is the one caller that wants the artwork regardless. */export function getReplyIcon(replyCount: number, restricted: boolean) { const dotCount = Math.min(3, Math.max(0, Math.floor(replyCount))) return replyIcons[restricted ? 1 : 0][dotCount]}
export function useReplyIcon(replyCount: number, restricted: boolean) { const indicators = useReplyIconIndicators() ?? true return indicators ? getReplyIcon(replyCount, restricted) : Bubble}