[Bug]: Support for defaultProps in Function Components to be Removed

[its-me-abhishek]

What happened?

The following warning appears in the console while running the application: Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.

This warning points to the LoadingIndicator component here (and exists in other components as well), which currently relies on defaultProps for setting default values. As this feature will be deprecated in upcoming React versions, the codebase should transition to using default parameter values in function component definitions.

Steps to reproduce

1. Run the application using the default settings.
2. Navigate to the link to the UI in browser
3. Observe the console for the warning.

Expected behavior

The defaultProps should be removed from the codebase and migration should be done similar to this as discussed previously on Slack

Relevant log output

Support for defaultProps will be removed from function components in a future major release. Use JavaScript default parameters instead.

Components to be updated

• [x] LoadingIndicator
• [x] BreakableText
• [x] ErrorMessage
• [x] NewWindowIcon
• [ ] SearchForm
• [x] ScatterPlot
• [x] TraceHeader
• [x] Ticks
• [x] TimelineRow
• [x] AccordianKeyValues
• [x] AccordianLogs
• [x] AccordianText
• [x] KeyValuesTable
• [x] MiniMap

[yurishkuro]

@its-me-abhishek could you enumerate the scope of this issue? How many components need to be updated?

[its-me-abhishek]

hey, 13 components are yet to be updated:

[yurishkuro]

@its-me-abhishek I suggest putting them in the description as a checkbox list (using * [ ] name syntax), so that we can track progress.

[its-me-abhishek]

Done! will try to fix them in a similar sequence asap

[its-me-abhishek]

@yurishkuro, SearchForm.jsx contains defaultProps, but destructuring with an interface (with Typescript) is what needs to be done to remove defaultProps and propTypes. Shall we convert it to a .tsx? Reference

[ADI-ROXX]

@its-me-abhishek @yurishkuro SearchForm is a class component, not a functional component, so I think it is okay to use defaultProps in it since it's not deprecated for React 18. So I don't think there is any need to change it.

Also, there is the following issue #2610 that deals with converting the class components to functional components. So, maybe we can convert the class component into a functional component directly.

[IITI-tushar]

@yurishkuro is this issue still open?

I will submit a PR for it soon.

[kallal79]

@yurishkuro, I'd love to work on this issue. Could you assign it to me?

[HetviThakkar-025]

Hi! 👋 I’m Hetvi, preparing for the upcoming LFX Fall 2025 mentorship, and I’d love to work on this issue as my first open source contribution.

@its-me-abhishek May I please get assigned to it? Once confirmed, I’ll start working on refactoring the Function Components to remove defaultProps and use default parameter values instead. Thanks!