fix(watch-button): eliminate N+1 API calls on profile watchlist

[Alm0stSurely]

Problem

On the Profile page, each in the Watchlist section independently called checkIsWatched() on mount. For a user with N watched repos, this resulted in N+1 API requests (1 for getWatchlist() + N for individual checks), even though the parent already knew by definition that every repo in the watchlist was being watched.

Analysis

The N+1 pattern occurred because:

1. WatchButton had no way to receive initial state from its parent
2. The same component was used in both contexts (Profile where state is known, Discover where it isn't)
3. Each instance triggered its own useEffect fetch on mount

Solution

1. Added optional initialIsWatched?: boolean prop to WatchButton

   • When provided, the component skips the checkIsWatched API call
   • Uses initialIsWatched === undefined to distinguish "unknown" from "known false"

2. Added optional onUnwatch?: () => void callback

   • Enables optimistic UI removal when unwatching from the Profile page
   • Card disappears immediately without waiting for page reload

3. Updated Profile page to pass initialIsWatched={true} for all watchlist items

Verification

• TypeScript compilation passes (npx tsc --noEmit)
• Discover page behavior unchanged (no prop = still fetches)
• Profile page now fires 1 API call instead of N+1

Files Changed

• frontend/components/watch-button.tsx — add props, conditional fetch skip
• frontend/app/(auth)/profile/page.tsx — pass initial state and unwatch handler

Fixes #57

[Vedant1703]

Great work @Alm0stSurely !

Could you please update the PR description to match our Official Contribution Template? Following the format makes it much easier for us to review your logic and track the related issue.

📖 Reference: Contributing Guide - PR Format

Once you've updated the description, let me know and I'll take another look!"