Merge branch 'main' into fix_consumer_provider_logic

Author: zcc0077

keep-ui/__mocks__/@monaco-editor/react.js

@@ -0,0 +1,30 @@
+const React = require('react');
+
+module.exports = {
+  Editor: () => React.createElement('div', { 'data-testid': 'monaco-editor' }),
+  DiffEditor: () => React.createElement('div', { 'data-testid': 'monaco-diff-editor' }),
+  loader: {
+    config: jest.fn(),
+    init: jest.fn(() => Promise.resolve({
+      editor: {
+        create: jest.fn(),
+        defineTheme: jest.fn(),
+        setTheme: jest.fn(),
+        getModel: jest.fn(),
+        setModelMarkers: jest.fn(),
+      },
+      languages: {
+        register: jest.fn(),
+        setMonarchTokensProvider: jest.fn(),
+        setLanguageConfiguration: jest.fn(),
+        registerCompletionItemProvider: jest.fn(),
+      },
+      MarkerSeverity: {
+        Error: 8,
+        Warning: 4,
+        Info: 2,
+        Hint: 1,
+      },
+    })),
+  },
+};

keep-ui/__mocks__/monaco-editor.js

@@ -0,0 +1,21 @@
+module.exports = {
+  editor: {
+    create: jest.fn(),
+    defineTheme: jest.fn(),
+    setTheme: jest.fn(),
+    getModel: jest.fn(),
+    setModelMarkers: jest.fn(),
+  },
+  languages: {
+    register: jest.fn(),
+    setMonarchTokensProvider: jest.fn(),
+    setLanguageConfiguration: jest.fn(),
+    registerCompletionItemProvider: jest.fn(),
+  },
+  MarkerSeverity: {
+    Error: 8,
+    Warning: 4,
+    Info: 2,
+    Hint: 1,
+  },
+};

keep-ui/app/(keep)/incidents/[id]/alerts/ALERT_SIDEBAR_INTEGRATION.md

@@ -0,0 +1,60 @@
+# AlertSidebar Integration in Incident Alerts
+
+## Overview
+This implementation replaces the `ViewAlertModal` component with the `AlertSidebar` component in the incident alerts page to provide a consistent user experience across the application.
+
+## Changes Made
+
+### 1. Component Integration (`incident-alerts.tsx`)
+- **Removed**: `ViewAlertModal` import and usage
+- **Added**: `AlertSidebar` component from `@/features/alerts/alert-detail-sidebar`
+- **Updated State Management**:
+  - Replaced `viewAlertModal` state with `selectedAlert` and `isSidebarOpen`
+  - Added `isIncidentSelectorOpen` state for AlertSidebar compatibility
+
+### 2. User Interactions
+The AlertSidebar can be opened in two ways:
+1. **Row Click**: Clicking on any alert row in the table
+2. **View Button**: Clicking the "View Details" button in the action tray
+
+### 3. Key Features
+- **Consistent UI**: Uses the same sidebar component as the main alerts table
+- **Alert Details**: Shows alert name, severity, description, source, and other metadata
+- **Alert Timeline**: Displays audit history and state changes
+- **Related Services**: Shows topology map of related services
+- **Actions**: Supports workflow execution, status changes, and incident association
+
+### 4. Code Comments
+Added explanatory comments in the implementation:
+- Component replacement rationale
+- State management explanations
+- Handler function descriptions
+- Optional prop documentation
+
+## Testing
+
+### Test Coverage (`incident-alerts-sidebar.test.tsx`)
+Created comprehensive tests covering:
+1. **Rendering**: Verifies alerts are displayed correctly
+2. **Opening Sidebar**: Tests both row click and button click methods
+3. **Closing Sidebar**: Ensures proper cleanup
+4. **Alert Switching**: Tests switching between different alerts
+5. **Empty State**: Handles no alerts scenario
+6. **Loading State**: Covers data fetching states
+
+### Running Tests
+```bash
+cd keep-ui
+npm test -- --testPathPattern="incident-alerts-sidebar.test.tsx"
+```
+
+## Benefits
+1. **Consistency**: Same sidebar experience across all alert views
+2. **Feature Parity**: All alert actions available in incident context
+3. **Maintainability**: Single component to maintain instead of multiple modals
+4. **User Experience**: Familiar interaction patterns for users
+
+## Future Considerations
+- The sidebar supports additional features like workflow execution and status changes
+- These features can be enabled by passing the appropriate handlers as props
+- The component is designed to be extensible for future requirements