mirror of
https://github.com/Dvorinka/MyClubServer.git
synced 2026-06-03 18:22:57 +00:00
6.1 KiB
6.1 KiB
Analytics Graph Improvements - Summary
Problem Identified
The analytics graph displayed no data visually, showing an empty chart with no bars or information.
Root Cause
- UMAMI_WEBSITE_ID is empty in the
.envfile - Backend was returning empty data arrays
{}and[]when Umami connection failed - No visual feedback to indicate why analytics were not working
- Limited logging made troubleshooting difficult
Solutions Implemented
1. Enhanced Frontend Error Handling
File: frontend/src/pages/admin/AnalyticsAdminPage.tsx
Changes:
-
Added state variables:
hasData: Tracks whether any analytics data was receivederrorMessage: Stores user-friendly error messages
-
Data validation:
- Checks if stats contain actual values (pageviews > 0, visitors > 0)
- Validates pageviews array has non-zero values
- Verifies metrics arrays have data
-
Visual improvements:
- Orange warning card when no data is available with:
- Clear error message in Czech
- List of possible causes
- Step-by-step troubleshooting instructions
- "Reload page" button for retry
- Empty state in graph area when no pageviews exist
- Friendly icon and message: "Žádná data pro zobrazení"
- Orange warning card when no data is available with:
2. Enhanced Backend Logging
Files:
internal/controllers/umami_controller.gointernal/services/umami_service.go
Changes:
-
Detailed logging at every step:
// Before: No logging // After: logger.Info("UMAMI_WEBSITE_ID is empty, attempting to auto-detect...") logger.Info("Attempting to find Umami website by domain: %s", host) logger.Info("Found default Umami website: ID=%s, Name=%s, Domain=%s", ...) logger.Info("Successfully fetched Umami stats for websiteID=%s (days=%d)", ...) -
Better error messages:
- Shows which configuration values are missing
- Displays URLs being attempted
- Logs authentication success/failure with timestamps
- Shows website detection process step-by-step
-
Improved resolveWebsiteID:
- Logs when using cached ID
- Logs when attempting auto-detection
- Logs domain matching attempts
- Logs fallback to first available website
3. Graceful Fallback Behavior
- API endpoints return empty objects/arrays instead of errors
- Frontend handles empty data without crashing
- Clear user feedback instead of silent failures
User Experience Improvements
Before:
- Empty graph with no explanation
- No indication of what's wrong
- Difficult to diagnose issues
- Required checking backend logs
After:
-
If configured correctly:
- Statistics display normally
- Graph shows pageview data
- All metrics visible
-
If not configured:
- Orange warning banner explains the issue
- Lists possible causes
- Provides clear troubleshooting steps
- Reload button for easy retry
-
If no traffic yet:
- Empty state with friendly message
- Clear indication this is expected
- No alarming error messages
Technical Details
Auto-Detection Flow:
- Check if
UMAMI_WEBSITE_IDis set → Use it - Try to match by
FRONTEND_BASE_URLdomain - Fall back to first available website in Umami
- Cache the detected ID in memory
- Log each step for transparency
Error Detection Logic:
const hasAnyStats = statsResponse.data && (
(statsResponse.data.pageviews?.value && statsResponse.data.pageviews.value > 0) ||
(statsResponse.data.visitors?.value && statsResponse.data.visitors.value > 0)
);
const hasPageviews = pageviewsDataArray.length > 0 &&
pageviewsDataArray.some(d => d.value > 0);
const hasMetrics = pages.data?.length > 0 || countries.data?.length > 0;
setHasData(hasAnyStats || hasPageviews || hasMetrics);
Testing
To verify the fix works:
- Restart backend server
- Open
/admin/analytika - Check for:
- Orange warning if not configured (expected)
- Graph with data if configured
- Clear error messages instead of blank page
To generate test data:
- Visit your website multiple times
- Navigate between pages
- Wait 2-5 minutes
- Refresh analytics page
- Data should appear
Files Modified
-
frontend/src/pages/admin/AnalyticsAdminPage.tsx
- Added error state management
- Enhanced visual feedback
- Better empty states
-
internal/controllers/umami_controller.go
- Enhanced logging throughout
- Better error messages
- Improved website ID resolution
-
internal/services/umami_service.go
- Added logging to authentication
- Better website detection logs
- Improved error messages
-
Documentation (new):
ANALYTICS_GRAPH_FIX.md- Detailed troubleshooting guideANALYTICS_TEST_INSTRUCTIONS.md- Step-by-step testing guideANALYTICS_IMPROVEMENTS_SUMMARY.md- This file
Configuration Reference
Required in .env:
UMAMI_URL=https://umami.tdvorak.dev # ✓ Set
UMAMI_USERNAME=admin # ✓ Set
UMAMI_PASSWORD=eevRQ6h3G@!c#y4A1T # ✓ Set
UMAMI_WEBSITE_ID= # Empty (will auto-detect)
Benefits
- Better User Experience: Clear feedback instead of confusion
- Easier Troubleshooting: Logs show exactly what's happening
- Self-Healing: Auto-detects website ID when possible
- Production Ready: Graceful handling of all failure scenarios
- Maintainable: Clear code with good error messages
Next Steps
- Restart backend to apply changes
- Test the analytics page to verify it works
- Monitor logs for any connection issues
- Create Umami website if none exists
- Optional: Set
UMAMI_WEBSITE_IDin.envonce detected
Monitoring
Watch these log messages:
✓ Successfully authenticated with Umami✓ Found default Umami website: ID=...✓ Successfully fetched Umami stats✗ No Umami websites found→ Create website✗ Authentication failed→ Check credentials✗ Failed to resolve Umami website ID→ Check connection
Support
If issues persist:
- Check backend logs for errors
- Verify Umami is accessible at configured URL
- Ensure website exists in Umami dashboard
- Review documentation in
ANALYTICS_GRAPH_FIX.md