- Updated the `IntegrationService` to perform connection tests using only the API key, removing reliance on username and app password. - Simplified health check logic and improved error messaging for better clarity. - Added functionality to revoke API keys in the `WordPressIntegrationForm` component. - Enhanced site settings page with a site selector and improved integration status display. - Cleaned up unused code and improved overall structure for better maintainability.
4.0 KiB
Connection Status Indicator Fix
Date: 2025-11-22
Problem
The "Connected" indicator on the Site Settings page was incorrectly showing "Connected" status just because the Hosting Type was set to "WordPress", without actually verifying:
- Whether a WordPress integration was configured
- Whether the API credentials were valid
- Whether the connection was authenticated
This gave a false sense of connection when no actual integration existed.
Root Cause
There were two places in the code that incorrectly assumed a site was "connected" based only on hosting type:
Issue 1: In loadSite() function (Line 152-155)
// WRONG ❌
if (!wordPressIntegration && (data.wp_api_key || data.hosting_type === 'wordpress')) {
setIntegrationTestStatus('connected');
setIntegrationLastChecked(new Date().toISOString());
}
Problem: Marked as "connected" if hosting type was WordPress, regardless of actual integration status.
Issue 2: In runIntegrationTest() function (Line 235-239)
// WRONG ❌
if (site?.wp_api_key || site?.wp_url || site?.hosting_type === 'wordpress') {
setIntegrationTestStatus('connected');
setIntegrationLastChecked(new Date().toISOString());
return;
}
Problem: Assumed "connected" if hosting type was WordPress without testing the actual connection.
Solution
Fix 1: Removed automatic "connected" status in loadSite()
// FIXED ✅
});
// Don't automatically mark as connected - wait for actual connection test
Result: Site loading no longer assumes connection status. It waits for the actual integration test.
Fix 2: Changed runIntegrationTest() to require actual integration
// FIXED ✅
if (wordPressIntegration && wordPressIntegration.id) {
resp = await fetchAPI(`/v1/integration/integrations/${wordPressIntegration.id}/test_connection/`, { method: 'POST', body: {} });
} else {
// No integration configured - mark as not configured
setIntegrationTestStatus('not_configured');
return;
}
Result: Connection test only runs if there's an actual integration record with credentials. Otherwise, shows "Not configured".
New Behavior
✅ "Connected" Status - Only When:
- Integration exists - There's a SiteIntegration record with credentials
- Connection tested - The
/test_connection/API call succeeds - Authentication valid - The API credentials are verified by the backend
⚠️ "Not configured" Status - When:
- No SiteIntegration record exists
- No WordPress integration is set up
- Even if hosting type is "WordPress"
🔴 "Error" Status - When:
- Integration exists but connection test fails
- API credentials are invalid
- WordPress site is unreachable
⏳ "Pending" Status - When:
- Connection test is currently running
Files Modified
File: /data/app/igny8/frontend/src/pages/Sites/Settings.tsx
Changes:
- ✅ Removed lines 152-155 that set "connected" based on hosting type
- ✅ Removed lines 235-239 that assumed connection without testing
- ✅ Now requires actual integration record to show "connected"
- ✅ Only shows "connected" after successful test_connection API call
Testing Scenarios
Scenario 1: Site with WordPress hosting but NO integration
- Before Fix: ❌ Shows "Connected" (WRONG)
- After Fix: ✅ Shows "Not configured" (CORRECT)
Scenario 2: Site with configured WordPress integration & valid credentials
- Before Fix: ✅ Shows "Connected" (already correct)
- After Fix: ✅ Shows "Connected" (still correct)
Scenario 3: Site with configured integration but invalid credentials
- Before Fix: ❌ Shows "Connected" (WRONG)
- After Fix: ✅ Shows "Error" (CORRECT)
Impact
This fix ensures that users can trust the connection indicator:
- Green = Actually connected and authenticated
- Gray = Not configured (need to set up integration)
- Red = Configuration exists but connection failed
- Yellow = Testing connection
No more false positives! 🎯