IAV-681/ Redesign Legal Agent (Aqal) UI with mint theme and enhanced UX
- Migrated color palette from green to mint
- Features:
- Add account selection UI with mock data for pre-configured Teams and Slack accounts
- Implement dynamic form generation based on API credential schemas
- Fetch schemas from /api/izemx-core-n8n/credential/juridique/schema/{TYPE}
- Dynamically render required fields from API response
- Support both schema-based and legacy webhook URL configurations
- Add connection testing functionality with visual feedback
- "Test Connection" button for new and existing accounts
- Success notifications displayed at top of page
- Connection status tracking and display
- Implement Teams-specific configuration flow
- Team selection (required) with mock data
- Channel selection (optional) with mock data
- Display after successful connection test
- Implement Slack-specific configuration flow
- OAuth token input with validation
- Webhook URL generation from OAuth token
- Copy to clipboard functionality for generated webhook
- Display after successful connection test
- Add comprehensive form validation for Slack
- Required field validation
- OAuth token format validation (xoxb- prefix)
- Connection test status validation
- Webhook generation status validation
- Account name validation
- Visual error feedback with error messages
- Add account summary/recap display
- Show configured account details after selection/configuration
- Display connection status, team/channel info, webhook URLs
- "Modify" button to reset configuration
- Hide form when account is configured and connection tested
- Add account management
- Save new accounts to account list after configuration
- Display new accounts in recap after saving
- Support account reuse across multiple agents UI/UX Improvements:
- Add "shiny" style effects to configuration guide steps
- Style "Test Connection" and "Generate Webhook URL" buttons as outlined with agent primary color
- Reduce "Test Connection" button size relative to "Add Account" button
- Add tooltip for locked Slack tab: "You cannot access Slack without completing Teams configuration"
- Add description for "Account Name" field: "Account identification name. Reusable for other agents using the same account"
- Replace "Rappels Intelligents" with "Notifications Proactives" in welcome step
- Display success messages as notifications at top of page
Technical Improvements:
- Create juridiqueCredentialEndpoints for centralized API endpoint management
- Add TeamsAccount and CredentialSchema TypeScript interfaces
- Replace all ternary conditions {condition && ...} with ConditionalComponent for code consistency
- Improve TypeScript null safety with proper optional chaining
- Fix integration validation logic to correctly detect configured accounts
- Add disabled state to "Next" button when step is not valid
- Fix "Too many re-renders" error by separating render-time validation from state-modifying validation