fix: follow button fixed width
This commit is contained in:
parent
3e419d6715
commit
1d29d53c7b
3
src/Element/FollowButton.css
Normal file
3
src/Element/FollowButton.css
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
.follow-button {
|
||||||
|
width: 92px;
|
||||||
|
}
|
@ -1,3 +1,4 @@
|
|||||||
|
import "./FollowButton.css";
|
||||||
import { useSelector } from "react-redux";
|
import { useSelector } from "react-redux";
|
||||||
import useEventPublisher from "Feed/EventPublisher";
|
import useEventPublisher from "Feed/EventPublisher";
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||||
@ -14,6 +15,7 @@ export default function FollowButton(props: FollowButtonProps) {
|
|||||||
const pubkey = parseId(props.pubkey);
|
const pubkey = parseId(props.pubkey);
|
||||||
const publiser = useEventPublisher();
|
const publiser = useEventPublisher();
|
||||||
const isFollowing = useSelector<RootState, boolean>(s => s.login.follows?.includes(pubkey) ?? false);
|
const isFollowing = useSelector<RootState, boolean>(s => s.login.follows?.includes(pubkey) ?? false);
|
||||||
|
const baseClassname = `${props.className} follow-button`
|
||||||
|
|
||||||
async function follow(pubkey: HexKey) {
|
async function follow(pubkey: HexKey) {
|
||||||
let ev = await publiser.addFollow(pubkey);
|
let ev = await publiser.addFollow(pubkey);
|
||||||
@ -26,7 +28,11 @@ export default function FollowButton(props: FollowButtonProps) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
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'}
|
{isFollowing ? 'Unfollow' : 'Follow'}
|
||||||
</button>
|
</button>
|
||||||
)
|
)
|
||||||
|
Loading…
Reference in New Issue
Block a user