Profile interface and web components lifecycle improvements

[thehabes]

Summary

Fixes #418 - Eliminates the "flash" UI behavior on the /profile page caused by multiple redundant API calls and render cycles.

Problem

The profile page had a cascade effect where:

• 5 components called TPEN.attachAuthentication(this) which sets the tpen-user-id attribute
• 4 profile components observed this attribute and each triggered User.getProfile()
• Each getProfile() dispatched tpen-user-loaded event
• All 4 components listened for this event and re-rendered

Result: Up to 16 render cycles (4 events × 4 listeners) plus 3 redundant getUserProjects() API calls.

Solution

Created two new utilities following the existing onProjectReady pattern:

• utilities/userReady.js - Handles user data readiness with caching and single-fetch guarantee
• utilities/userProjectsReady.js - Handles user projects with caching and single-fetch guarantee

Refactored 4 profile components to use these utilities instead of attribute observation:

• components/user-profile/index.js
• components/user-profile/userStats.js
• components/user-profile/report.js
• components/user-profile/contributionActivity.js

Key Changes

• Module-level singleton flags prevent concurrent API fetches
• _isRendering guards prevent double renders when callbacks fire quickly
• Proper cleanup via unsubscribe functions in disconnectedCallback
• Removed observedAttributes and attributeChangedCallback (internal implementation detail, not a breaking change)

Expected Results

Metric	Before	After
tpen-user-loaded events	4	1
getUserProjects() calls	3	1
Render cycles	Up to 16	4 (one per component)
Visual flashing	Yes	No

[github-actions]

🚀 Deployed on https://69826102578f243269eb2550--tpen-interfaces-preview.netlify.app