Problem

The same social link UI logic was duplicated in multiple places across the app. Each location manually rendered GitHub, LinkedIn, X, and in one case Email links with repeated animation props, tooltip text, click handling, and URL construction.

Why this was a problem

• High maintenance cost: any small change to social links required editing multiple files.
• Risk of code drift: behavior or styling could become inconsistent across pages.
• Lower readability: large repeated JSX blocks made components harder to scan.
• Greater bug surface: duplication increases chance of regressions when updates are made.

Expected impact

• Consistent social link behavior and UI across the project.
• Smaller, cleaner parent components.
• Easier future updates with one source of truth.
• Reduced risk of regressions and styling mismatch.