import clsx from 'clsx'
import { Fold } from '../../../common/fold'
import { useFollowedFolds } from '../../hooks/use-fold'
import { useUser } from '../../hooks/use-user'
import { followFold, unfollowFold } from '../../lib/firebase/folds'
export function FollowFoldButton(props: { fold: Fold; className?: string }) {
const { fold, className } = props
const user = useUser()
const followedFoldIds = useFollowedFolds(user)
const following = followedFoldIds
? followedFoldIds.includes(fold.id)
: undefined
const onFollow = () => {
if (user) followFold(fold.id, user.id)
}
const onUnfollow = () => {
if (user) unfollowFold(fold, user)
}
if (!user || following === undefined)
return (
)
if (following) {
return (
)
}
return (
)
}