design a front end for logging these types of payment errors. create multiple tabs of the same logging with different styles
Business/User Value: As a merchant I want to be able to pull Bold Booster logs to understand why payments failed
Acceptance Criteria:
Expose the ability to see failed payment transactions from Bold Booster logs to the admin
Given merchants trying to debug payment issues, then they should be able to read/export Bold Booster payment failure logs from the admin
Given merchants trying to debug payment issues then they should be able to read/export Bold Booster payment failure logs from the admin
Acceptance Test: (The steps needed to complete the story):
GIVEN a M2 storefront using Bold booster
WHEN a merchant tries to debug a failed payment
THEN they should be able to read/export logs from the admin
E2E Tests
Test Scenarios
Valid Request: Admin user requests logs for valid date range
Pagination: Test pagination with large result sets
Filtering: Test filtering by gateway type and error codes
Export Format: Test both JSON and CSV export formats
Access Control: Verify logs are scoped to correct consumer
Date Validation: Test with invalid date ranges
Empty Results: Test when no failures exist for criteria
Test Data Requirements
Failed payment transactions across multiple gateways
Transaction errors with various error codes
Multiple consumers to test isolation
QA Test Scenarios
Manual Testing
Authentication: Test with valid/invalid API keys
Data Accuracy: Verify logs match actual payment failures
Performance: Test with large datasets (1000+ failures)
Export Functionality: Download and verify CSV format
Edge Cases: Test with special characters in error messages
Browser Compatibility: Test admin interface across browsers
Security Testing
Attempt to access logs from different consumer
Test with malformed request parameters
Verify PAN data is properly filtered from responses
Developer Notes
Logging Infrastructure: Uses structured logging with slog, NewRelic integration, and Google Cloud Logging format
Error Storage: eps_transaction_errors table stores error records with ID, status_code, message, and created_at
Transaction Tables: All transaction tables (eps_transactions_auth, eps_transactions_capture, etc.) have error_id foreign keys
Admin API: Existing admin controller with endpoints for gateway management under /consumers/:consumer_slug/
Designer Notes
TBD
Security Notes/Concerns
Authentication & Authorization
✅ Leverage existing mw.VerifyApiConsumer() middleware
✅ Ensure logs are scoped to the authenticated consumer only
✅ Apply same access controls as other admin endpoints
Data Protection
PAN Filtering: Apply filters.ScanAndCleanPan() to error messages (similar to other gateways)
Sensitive Data: Exclude customer PII from logs (card numbers, addresses, emails)
Rate Limiting: Consider implementing rate limits for export functionality
Audit Trail
Log admin access to payment failure logs using existing log.Info() with proper context
Include admin user identification in audit logs
I'll create a comprehensive payment error logging frontend with multiple tabs showing different styles for viewing the same data. This will help merchants debug failed payment transactions effectively.
I've created a comprehensive payment error logging frontend with four different viewing styles:
Multiple Tab Views:
Advanced Filtering:
Export Functionality:
Dashboard Metrics:
Security & Data Protection:
Interactive Features:
The interface follows the acceptance criteria by providing merchants with the ability to read, filter, and export Bold Booster payment failure logs through an intuitive admin interface. Each tab offers a different perspective on the same data to accommodate different debugging workflows.