Rename chart-edit component to panel-edit and add signal-based table …#1625
Rename chart-edit component to panel-edit and add signal-based table …#1625
Conversation
…fetching - Rename ChartEditComponent to PanelEditComponent (files, class, selector, CSS classes) - Add signal-based fetchTablesSignals to TablesService using httpResource - Use TablesService.tablesSignal in panel-edit instead of RxJS firstValueFrom - Remove silent try/catch in AI prerequisites loading Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
There was a problem hiding this comment.
Pull request overview
This pull request performs a comprehensive rename of the chart-edit component to panel-edit while simultaneously introducing a modern signal-based approach for fetching table data. The changes align with Angular's latest reactive patterns and maintain consistency with the existing DashboardsService implementation.
Changes:
- Renamed ChartEditComponent to PanelEditComponent across all files (TypeScript, HTML, CSS, tests, and routing)
- Added signal-based table fetching to TablesService using httpResource pattern with setActiveConnectionForTables method
- Replaced async/await RxJS firstValueFrom pattern with direct signal consumption in panel-edit component
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| frontend/src/app/services/tables.service.ts | Added signal-based table fetching with _tablesResource, tablesSignal, and setActiveConnectionForTables; fixed console.log formatting |
| frontend/src/app/components/charts/panel-edit/panel-edit.component.ts | Renamed class from ChartEditComponent to PanelEditComponent; updated selector and file references; replaced firstValueFrom with tablesSignal consumption; simplified _loadAiPrerequisites |
| frontend/src/app/components/charts/panel-edit/panel-edit.component.spec.ts | Updated all test references from ChartEditComponent to PanelEditComponent |
| frontend/src/app/components/charts/panel-edit/panel-edit.component.html | Renamed CSS classes from chart-edit-* to panel-edit-* |
| frontend/src/app/components/charts/panel-edit/panel-edit.component.css | Updated all CSS class names from chart-edit-* to panel-edit-* |
| frontend/src/app/app-routing.module.ts | Updated component imports to reference panel-edit instead of chart-edit |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| // Signal-based tables fetching | ||
| private _api = inject(ApiService); | ||
| private _activeConnectionId = signal<string | null>(null); | ||
| private _tablesResource = this._api.resource<TableProperties[]>( | ||
| () => { | ||
| const connectionId = this._activeConnectionId(); | ||
| if (!connectionId) return undefined; | ||
| return `/connection/tables/${connectionId}`; | ||
| }, | ||
| { errorMessage: 'Failed to fetch tables' }, | ||
| ); | ||
| public readonly tablesSignal = computed(() => this._tablesResource.value() ?? []); | ||
| public readonly tablesLoading = computed(() => this._tablesResource.isLoading()); | ||
|
|
||
| setActiveConnectionForTables(connectionId: string): void { | ||
| this._activeConnectionId.set(connectionId); | ||
| } |
There was a problem hiding this comment.
The new signal-based table fetching functionality lacks test coverage. The TablesService already has a test file (tables.service.spec.ts) with tests for the existing fetchTables method, but there are no tests for the new signal-based implementation including setActiveConnectionForTables, tablesSignal, and tablesLoading. Consider adding tests to verify: 1) that calling setActiveConnectionForTables triggers a resource fetch, 2) that tablesSignal returns the fetched data, 3) that tablesLoading reflects the loading state, and 4) that setting a null connectionId returns an empty array.
Renamed сassandra_logo.svg and сassandra_logo_dark.svg to use Latin 'c' and updated icon registry paths in app.component.ts. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…fetching