import { useFetchFollowingCount } from "@replyke/react-js";

function MyFollowingCounter() {
  const fetchFollowingCount = useFetchFollowingCount();

  const getMyFollowingCount = async () => {
    try {
      const result = await fetchFollowingCount();
      console.log(`You are following ${result.count} users`);
    } catch (error) {
      console.error("Failed to fetch following count:", error.message);
    }
  };

  return <button onClick={getMyFollowingCount}>Check Who I'm Following</button>;
}

import { useFetchFollowingCount } from "@replyke/react-js";
import { useState, useEffect } from "react";

function FollowingCountDisplay() {
  const fetchFollowingCount = useFetchFollowingCount();
  const [count, setCount] = useState<number | null>(null);
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState<string | null>(null);

  useEffect(() => {
    const loadCount = async () => {
      setLoading(true);
      setError(null);
      try {
        const result = await fetchFollowingCount();
        setCount(result.count);
      } catch (err) {
        setError(err instanceof Error ? err.message : 'Failed to load count');
      } finally {
        setLoading(false);
      }
    };

    loadCount();
  }, [fetchFollowingCount]);

  if (loading) return <div>Loading following count...</div>;
  if (error) return <div>Error: {error}</div>;

  return (
    <div className="following-count">
      <h3>{count ?? 0}</h3>
      <p>Following</p>
    </div>
  );
}

import { useFetchFollowingCount } from "@replyke/react-js";
import { useEffect, useState } from "react";

interface ProfileStats {
  following: number;
  // ... other stats
}

function ProfileStatsDashboard() {
  const fetchFollowingCount = useFetchFollowingCount();
  const [stats, setStats] = useState<ProfileStats>({ following: 0 });
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const loadStats = async () => {
      try {
        const followingResult = await fetchFollowingCount();
        setStats(prev => ({ ...prev, following: followingResult.count }));
      } catch (error) {
        console.error("Failed to load profile stats:", error);
      } finally {
        setLoading(false);
      }
    };

    loadStats();
  }, [fetchFollowingCount]);

  if (loading) return <div>Loading profile stats...</div>;

  return (
    <div className="profile-stats-dashboard">
      <div className="stat-card">
        <div className="stat-number">{stats.following.toLocaleString()}</div>
        <div className="stat-label">Following</div>
        <div className="stat-description">Users you follow</div>
      </div>
    </div>
  );
}