feat: release candidate v0.45.0#1018
Conversation
feat: use Table in devtron, argo & flux listings
…ck.json; improve textarea height adjustment logic
…up fill; update ClipboardButton to support borderLess variant
…ck.json; add new routes for Docker registries and Git providers
…ck.json; refactor PageHeader component to use AskDevtronButton
…ck.json; modify getDockerRegistriesListMin to include isDefault in response type
…mon-lib into fix/ai-fixes
…n-fe-common-lib into feat/ai-actions
…n-fe-common-lib into feat/ai-feedback
feat: ai feedback
…n-fe-common-lib into feat/ai-actions-and-feedback
…n-fe-common-lib into feat/ai-actions-and-feedback
feat: ai actions and feedback
feat: add ai chat bot
chore: update version to 1.23.0 in package.json and package-lock.json
There was a problem hiding this comment.
Pull request overview
This pull request is a release candidate (v0.45.0/v1.23.0) that introduces substantial enhancements to the common component library, focusing on improved UI flexibility, API utilities, and type definitions. The changes include a major refactor of the DraggableWrapper component for better viewport positioning, new minimal API endpoints for autocomplete features, expanded table functionality with expandable rows, and enhanced AI/debugging context management.
Changes:
- Refactored
DraggableWrapperto use fixed positioning at viewport top-left with improved default positioning logic, changedboundaryGapfrom number to{x, y}object, and removed deprecatedlayoutFixDeltaparameter - Added expandable rows feature to Table component with keyboard shortcuts (ArrowLeft/Right), expand/collapse functionality, and support for row start icons
- Enhanced AI agent context types with structured data models for different app types (Devtron, Helm, Argo, Flux) and added debug agent context support
- Added new minimal API endpoints (
getDockerRegistriesListMin,getGitProvidersListMin) and constants for external app types - Improved
CoreAPIto conditionally set Content-Type header, addeduseInfiniteQueryhook, and extendeduseMutationtype flexibility - Added multiple new icons for AI features, notifications, and integrations
- Various component enhancements including
SortableTableHeaderCellinfo tooltips,ClipboardButtonborderless variant, andTextareaauto-height fixes
Reviewed changes
Copilot reviewed 40 out of 59 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| src/Common/Constants.ts | Added APP_NAME pattern, new URL constants for external app types, and ATHENA route |
| src/Common/DraggableWrapper/* | Major refactor with fixed viewport positioning, boundaryGap type change, and PARENT_BOTTOM_RIGHT variant addition |
| src/Common/API/CoreAPI.ts | Conditional Content-Type header logic for multipart requests |
| src/Common/API/reactQueryHooks.ts | Added useInfiniteQuery hook and improved useMutation typing |
| src/Common/ClipboardButton/* | Added borderLess variant support |
| src/Common/SortableTableHeaderCell/* | Added infoTooltipText prop for header tooltips |
| src/Shared/Components/Table/* | Major feature: expandable rows with keyboard navigation and visual tree lines |
| src/Shared/Components/Textarea/* | Fixed auto-height calculation logic |
| src/Shared/Components/FloatingVariablesSuggestions/* | Integrated DraggableWrapper with new boundaryGap API |
| src/Shared/Components/Header/PageHeader.tsx | Replaced hardcoded Ask Devtron button with component from context |
| src/Shared/Components/AppStatusModal/* | Added debugAgentContext support for AI debugging |
| src/Shared/Components/Icon/Icon.tsx | Added 20+ new icons for various features |
| src/Shared/Providers/MainContextProvider/types.ts | Added comprehensive AIAgentContextType and DebugAgentContextType definitions |
| src/Shared/validations.tsx | Added validateAppName function |
| src/index.ts | Replaced FEATURE_ASK_DEVTRON_EXPERT with FEATURE_ATHENA_DEBUG_MODE_ENABLE |
| package.json | Bumped version to 1.23.0 |
| .eslintignore | Removed DraggableWrapper.tsx from ignore list |
Comments suppressed due to low confidence (3)
src/Common/DraggableWrapper/DraggableWrapper.tsx:97
- The new DraggablePositionVariant.PARENT_BOTTOM_RIGHT is added to the enum but there's no case for it in the switch statement in getDefaultPosition(). When this variant is used, it will fall through to the default case (SCREEN_BOTTOM_CENTER), which may not be the intended behavior. Either implement the case or remove the variant from the enum.
switch (positionVariant) {
case DraggablePositionVariant.PARENT_BOTTOM_CENTER: {
// center div to middle of the parent rect and then add the left offset of the parent rect
const x = (parentRect.width - nodeRefWidth) / 2 + parentRect.left
if (parentRect.height > windowSize.height) {
// since the parent itself overflows, we use windowSize for calculations
return { x, y: windowSize.height - boundaryGap.y - nodeRefHeight }
}
// y = parentRect.bottom will place the widget at the extreme bottom of the parent,
// therefore need to offset it to the top by boundary and its own height
const y = parentRect.bottom - nodeRefHeight - boundaryGap.y
return { x, y }
}
case DraggablePositionVariant.SCREEN_BOTTOM_RIGHT: {
// x = windowSize.width will place the widget at the extreme right,
// therefore need to offset it to the left by boundary and its own width
const x = windowSize.width - nodeRefWidth - boundaryGap.x
// y = windowSize.height will place the widget at the extreme bottom,
// therefore need to offset it to the top by boundary and its own height
const y = windowSize.height - nodeRefHeight - boundaryGap.y
return { x, y }
}
// Add more cases for other variants if needed
default: {
// we need to first place the start of the widget at (windowSize.width / 2)
// followed by moving it half of its own width to the left such that center of widget
// aligns with the central axis of the screen
const x = (windowSize.width - nodeRefWidth) / 2
// y = windowSize.height will place the widget at the extreme bottom,
// therefore need to offset it to the top by boundary and its own height
const y = windowSize.height - nodeRefHeight - boundaryGap.y
return { x, y }
}
}
src/Common/API/CoreAPI.ts:75
- There's a logic inconsistency in the fetch call. When isMultipartRequest is true, the code builds an options object with conditional headers (lines 54-65), but then on line 70 it checks !isMultipartRequest and either uses the constructed options OR creates a new object with only method and body. This means when isMultipartRequest is true, the signal and credentials from options are lost. The isMultipartRequest handling should either be unified or the signal and credentials should be included in the multipart request object.
const options: RequestInit = {
method: type,
signal,
body: data ? JSON.stringify(data) : undefined,
...(data && !isMultipartRequest
? {
headers: {
'Content-Type': 'application/json',
},
}
: {}),
}
// eslint-disable-next-line dot-notation
options['credentials'] = 'include' as RequestCredentials
return fetch(
`${isProxyHost ? '/proxy' : this.host}/${url}`,
!isMultipartRequest
? options
: ({
method: type,
body: data,
} as RequestInit),
src/Common/DraggableWrapper/types.ts:39
- The boundaryGap prop type has changed from
number(optional) toRecord<'x' | 'y', number>(optional). This is a breaking change for any consumers passing a number value for boundaryGap. While a default value{ x: 16, y: 16 }is provided for backward compatibility when not specified, any external code explicitly passing boundaryGap as a number will break. Consider documenting this as a breaking change or providing a migration path.
boundaryGap?: Record<'x' | 'y', number>
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Description
This pull request introduces several enhancements and fixes across the common component library, focusing on improved UI flexibility, API utilities, and bug fixes. The most notable changes include a major refactor of the
DraggableWrappercomponent for better positioning and usability, the addition of new minimal API endpoints for autocomplete features, and expanded support for button variants and tooltips in UI components.UI Component Improvements:
DraggableWrapperinsrc/Common/DraggableWrapper/DraggableWrapper.tsxto use fixed positioning at the viewport's top-left, removed legacy layout fixes, updated boundary gap handling to accept{ x, y }, and improved default positioning logic for various variants. The component now usesdefaultPositionand bounds to the main app container, and is exported as a named export. [1] [2] [3] [4] [5]borderLessvariant toClipboardButtonand updated itsaria-labelfor accessibility. Also improved tooltip handling and button rendering logic. [1] [2] [3]SortableTableHeaderCellto support an optional info tooltip icon beside the header label, improving usability and documentation for table columns. [1] [2] [3] [4]API and Utility Enhancements:
getDockerRegistriesListMinandgetGitProvidersListMininsrc/Common/Common.service.ts, and corresponding route constants insrc/Common/Constants.tsfor autocomplete functionality. [1] [2] [3]CoreAPIto conditionally setContent-Type: application/jsononly when appropriate, preventing issues with multipart requests.reactQueryHookswith a newuseInfiniteQueryhook and fixeduseMutationto return the correct generic type, enabling better integration with React Query. [1] [2]Constants and Patterns Updates:
PATTERNS. [1] [2] [3]Miscellaneous:
1.23.0inpackage.json..eslintignoreto remove the ignoredDraggableWrapper.tsxtest file, ensuring linting coverage.These changes collectively improve the flexibility, accessibility, and developer experience of the common component library.
Type of change
How Has This Been Tested?
Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration
Checklist