perf: migrate external images to Next.js Image

[EmmyKay0026]

Description

Migrates all production image rendering from standard HTML <img> elements to Next.js <Image />.

The new shared image component provides explicit dimensions, lazy loading, WebP optimization for approved remote hosts, blur-up placeholders, and graceful fallbacks when remote images fail to load.

Linked Issue

Closes #62

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation update
• UI/UX improvement
• Performance improvement
• Code refactoring

Summary of Changes

• Added a reusable ImageWithFallback component with fixed dimensions, lazy loading, blur placeholders, and URL-aware error recovery.
• Migrated ENS avatars and plugin icons from raw <img> elements to Next.js <Image />.
• Added equal-sized fallbacks for failed ENS avatars and plugin icons to prevent layout shifts.
• Configured WebP output and remote image patterns for CoinGecko, ENS, GitHub, and jsDelivr hosts.
• Bypassed server-side optimization for unknown remote hosts to avoid unsafe server fetches while retaining sizing, lazy loading, and fallback behavior.
• Added tests covering intrinsic dimensions, lazy loading, blur placeholders, optimized URLs, failed-image fallbacks, and retries when an image URL changes.
• Confirmed that no raw <img> elements remain in production source files.

Test Evidence

The following checks were run:

npm test
npm test -- --run components/ImageWithFallback.test.tsx components/Avatar.test.tsx
npm run lint
npm run typecheck
node node_modules/next/dist/bin/next build