例えばTwitterがどんなサイトでもフォローできるjsを提供してくれたら

// フォロー状態の確認
const check = (target) => {
  // フォローしていれば true, していなかったら false
  return true;
};

// フォローする
const follow = (target) => {
  return;
};

// フォロー解除
const unfollow = (target) => {
  return;
};

<button id="follow">読み込み中</button>

#follow {
  background: skyblue;
}

const target = 'TwitterJP';
const $follow = $('#follow');
let followed = false;

$(() => {
  followed = check(target);
  $follow.text = followed ? 'フォロー解除する' : 'フォローする';

  $follow.on('click', () => {
    $follow.text = '読み込み中';
    followed ? unfollow(target) : follow(target);
    followed = check(target);
    $follow.text = followed ? 'フォロー解除する' : 'フォローする';
  });
});

import SkyblueButton from 'skyblue-button';

export const FollowButton: React.FC<{ target: string }> = ({ target }) => {
  const [loading, setLoading] = useState(true);
  const [followed, setFollowed] = useState(false);

  useEffect(() => {
    const current = check(target);
    setFollowed(current);
    setLoading(false);
  }, []);

  const followHandler = () => {
    setLoading(true);
    follow(target);
    const current = check(target);
    setFollowed(current);
    setLoading(false);
  };

  const unfollowHandler = () => {
    setLoading(true);
    unfollow(target);
    const current = check(target);
    setFollowed(current);
    setLoading(false);
  };

  return (
    loading ? (
      <SkyblueButton>読み込み中</SkyblueButton>
    ) : followed ? (
      <SkyblueButton onClick={unfollowHandler}>フォロー解除する</SkyblueButton>
    ) : (
      <SkyblueButton onClick={followHandler}>フォローする</SkyblueButton>
    )
  )
};