fix: follow button fixed width

This commit is contained in:
Alejandro Gomez 2023-01-29 22:00:23 +01:00
parent 3e419d6715
commit 1d29d53c7b
No known key found for this signature in database
GPG Key ID: 4DF39E566658C817
2 changed files with 10 additions and 1 deletions

View File

@ -0,0 +1,3 @@
.follow-button {
width: 92px;
}

View File

@ -1,3 +1,4 @@
import "./FollowButton.css";
import { useSelector } from "react-redux";
import useEventPublisher from "Feed/EventPublisher";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@ -14,6 +15,7 @@ export default function FollowButton(props: FollowButtonProps) {
const pubkey = parseId(props.pubkey);
const publiser = useEventPublisher();
const isFollowing = useSelector<RootState, boolean>(s => s.login.follows?.includes(pubkey) ?? false);
const baseClassname = `${props.className} follow-button`
async function follow(pubkey: HexKey) {
let ev = await publiser.addFollow(pubkey);
@ -26,7 +28,11 @@ export default function FollowButton(props: FollowButtonProps) {
}
return (
<button type="button" className={isFollowing ? `${props.className ?? ''} secondary` : props.className} onClick={() => isFollowing ? unfollow(pubkey) : follow(pubkey)}>
<button
type="button"
className={isFollowing ? `${baseClassname} secondary` : baseClassname}
onClick={() => isFollowing ? unfollow(pubkey) : follow(pubkey)}
>
{isFollowing ? 'Unfollow' : 'Follow'}
</button>
)