Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
3 of 14 tasks
its-me-abhishek opened this issue Jan 18, 2025 · 6 comments · Fixed by #2609
Open
3 of 14 tasks

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

its-me-abhishek opened this issue Jan 18, 2025 · 6 comments · Fixed by #2609

Comments

@its-me-abhishek
Copy link
Contributor

its-me-abhishek commented Jan 18, 2025

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

  • LoadingIndicator
  • BreakableText
  • ErrorMessage
  • NewWindowIcon
  • SearchForm
  • ScatterPlot
  • TraceHeader
  • Ticks
  • TimelineRow
  • AccordianKeyValues
  • AccordianLogs
  • AccordianText
  • KeyValuesText
  • MiniMap
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 19, 2025
Updated defaultProps to use destructuring to avoid deprecation. Snapshots have been updated to match the changes. Resolves jaegertracing#2596.

Signed-off-by: Abhishek <[email protected]>
@ADI-ROXX ADI-ROXX mentioned this issue Jan 19, 2025
4 tasks
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 19, 2025
Resolves jaegertracing#2596 Updated the components to fix broken working.

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 19, 2025
Resolves jaegertracing#2596 Updated the ScatterPlot component to remove defaultProps

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 20, 2025
Partially Resolves jaegertracing#2596
- Updated the LoadingIndicator component to remove defaultProps so as to avoid the deprecation warnings.
- Updated the snapshots so as to match the new LoadingIndicator.

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 20, 2025
Partially Resolves jaegertracing#2596
- Updated the LoadingIndicator component to remove defaultProps so as to avoid the deprecation warnings.
- Updated the snapshots so as to match the new LoadingIndicator.

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 21, 2025
Partially Resolves jaegertracing#2596
- Updated the LoadingIndicator component to remove LoadingIndicatorProps so as to avoid redundancy.

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 21, 2025
Partially Resolves jaegertracing#2596
- Removed optional availability from multiple fields

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 23, 2025
Partially Resolves jaegertracing#2596
- Added optional availability to multiple fields

Signed-off-by: Abhishek <[email protected]>
yurishkuro added a commit that referenced this issue Jan 23, 2025
## Which problem is this PR solving?
- Part of #2596


## Description of the changes
- Updated the LoadingIndicator component to remove defaultProps so as to
avoid the deprecation warnings.
- Updated the snapshots so as to match the new LoadingIndicator.

## How was this change tested?
- Running `npm ci` `npm run update-snapshots` and `npm test` passes all
the tests
- Tested manually by rendering LoadingIndicator using various props

## Checklist
- [x] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [x] I have signed all commits
- [x] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: Abhishek <[email protected]>
Signed-off-by: Yuri Shkuro <[email protected]>
Co-authored-by: Yuri Shkuro <[email protected]>
@yurishkuro
Copy link
Member

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

@its-me-abhishek
Copy link
Contributor Author

hey, 13 components are yet to be updated:

Image

@yurishkuro
Copy link
Member

@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
Copy link
Contributor Author

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

yurishkuro pushed a commit that referenced this issue Jan 23, 2025
## Which problem is this PR solving?
- Resolves #2596 

## Description of the changes
- Wherever the default value was undefined, I have not added a default
value for it since it is automatically undefined.

## How was this change tested?
- npm run lint test

## Checklist
- [x] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [x] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [x] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
@yurishkuro yurishkuro reopened this Jan 23, 2025
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 24, 2025
Partially Resolves jaegertracing#2596
- Remove defaultProps and updated the snapshots for the same

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 24, 2025
Partially Resolves jaegertracing#2596
- Remove defaultProps from the component, replace with destructuring

Signed-off-by: Abhishek <[email protected]>
@its-me-abhishek
Copy link
Contributor Author

@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

Image

its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 24, 2025
Partially Resolves jaegertracing#2596
- Remove defaultProps from the TimelineRow component, replace with destructuring

Signed-off-by: Abhishek <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Jan 24, 2025
Partially Resolves jaegertracing#2596

Signed-off-by: Abhishek <[email protected]>
@ADI-ROXX
Copy link
Contributor

@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.

github-merge-queue bot pushed a commit that referenced this issue Jan 25, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 25, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 25, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 25, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 25, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 26, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 27, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [ ] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [ ] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [ ] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
Co-authored-by: Yuri Shkuro <[email protected]>
github-merge-queue bot pushed a commit that referenced this issue Jan 27, 2025
## Which problem is this PR solving?
- Part of #2596 

## Description of the changes
- 

## How was this change tested?
- 

## Checklist
- [x] I have read
https://github.com/jaegertracing/jaeger/blob/master/CONTRIBUTING_GUIDELINES.md
- [x] I have signed all commits
- [ ] I have added unit tests for the new functionality
- [x] I have run lint and test steps successfully
  - for `jaeger`: `make lint test`
  - for `jaeger-ui`: `npm run lint` and `npm run test`

---------

Signed-off-by: cs-308-2023 <[email protected]>
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Feb 1, 2025
its-me-abhishek added a commit to its-me-abhishek/jaeger-ui that referenced this issue Feb 1, 2025
Partially Resolves jaegertracing#2596

Signed-off-by: Abhishek <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
3 participants