[EuiIcon] Migrate from class to function component
- Dominant language
- TypeScript
- Stars
- 6.4k
- Forks
- 911
- Avg merge
- 2d 11h
- Merged PRs (30d)
- 65
Description
`EuiIcon` renders SVG icons with support for built-in icons, custom SVGs, and async icon loading. Used throughout every EUI application.
- **File:** `components/icon/icon.tsx`
- **Class size:** 209 lines
- **State:** `icon`, `iconTitle`, `isLoading`, `neededLoading`
- **Lifecycle:** `componentDidMount`, `componentDidUpdate`, `componentWillUnmount`
**Migration notes:**
PureComponent with async icon loading. `componentDidMount`/`componentDidUpdate` trigger icon imports, `componentWillUnmount` prevents state updates on unmounted component. The async loading pattern maps to `useEffect` with abort/cleanup. Replace `PureComponent` with `React.memo`.
**Acceptance criteria:**
- [ ] Convert to function component with `React.memo`
- [ ] Maintain async icon loading with proper cleanup
- [ ] Maintain loading state transitions
- [ ] All existing tests pass
- [ ] Verify no flash of missing icons during loading
Contributor guide
Assessment
This issue has not been assessed yet.