|
Introduce reusable Redfish API infrastructure and modernize the Sensors
page to use Vue 3 Composition API with TanStack Query, eliminating the
need for Vuex store patterns for server state management.
This change provides a foundation for migrating other hardware status
pages (Memory, Processors, Drives, etc.) to a more maintainable and
performant architecture.
Key changes:
1. Generic Redfish composables (src/api/composables/):
- useRedfishRoot.ts: Caches ServiceRoot and detects OData support
- useRedfishCollection.ts: Smart collection fetcher with OData
$expand/$select support and graceful fallback
- useAllSubResources.ts: Generic pattern for fetching nested
resources from parent collections
2. Sensors page modernization:
- Migrated from Vuex store to TanStack Query (Vue Query)
- Created useSensors.ts composable for data fetching
- Removed legacy Thermal and PowerSubsystem endpoints
- Now uses only modern /Chassis/{id}/Sensors collection
- Maintains existing UI/UX with Bootstrap Vue table
3. TypeScript support:
- Added tsconfig.json and webpack ts-loader configuration
- Created required Redfish type definitions
- Preserves Redfish PascalCase property names
4. Performance optimizations:
- Auto-detects and uses OData $expand for fewer API calls
- Implements automatic caching and deduplication
- Smart retry logic with exponential backoff
- 30-second stale time with 5-minute garbage collection
Benefits for future development:
- The generic composables are designed for reuse across components:
// Fetch all Memory from all Systems
useAllSubResources<Memory>('/redfish/v1/Systems', 'Memory')
// Fetch all Drives from all Storage
useAllSubResources<Drive>('/redfish/v1/Storage', 'Drives')
- Implemented TypeScript types
- Reuses existing Bootstrap table components
- Preserves existing UI/UX
- Focuses on infrastructure reusability
This pattern eliminates boilerplate Vuex store code and provides
better developer experience with automatic loading states, error
handling, and background refetching.
Tested-by: Manual testing on development server
- Sensors page loads correctly
- OData optimization works when supported
- Graceful fallback when OData unavailable
- All table functionality preserved (sorting, filtering,
export, cancel and searching)
Change-Id: Id605319140f607b295d24085f3681f09ac0d5ebd
Signed-off-by: Nishant Tiwari <tiwari.nishant@ibm.com>
|
