backstage / backstage/backstage
catalog: `metadata.annotations` can contain null value and will crash the inspect
- Dominant language
- TypeScript
- Stars
- 34.4k
- Forks
- 7.6k
- Avg merge
- 8h 57m
- Merged PRs (30d)
- 50
Description
### 📜 Issue Labels
- [x] Please familiarize yourself with the issue labels used in this project: [LABELS.md](https://github.com/backstage/backstage/blob/master/LABELS.md)
### 🔎 Search Terms
```plain
catalog inspect annotations metadata
```
### 🗃️ Project Area
Catalog
### 🔗 External Integration
N/A
### 📝 Description & Context
It's possible to have entity with annotations value as null if the entity is created programatically, for example:
```json
{
"apiVersion": "backstage.io/v1alpha1",
"kind": "Resource",
"spec": {
"type": "database",
"owner": "user:default/pekka"
},
"metadata": {
"name": "pekkas-database",
"annotations": {
"my-custom-annotation": null
}
}
}
```
This will crash the UI when going to inspect the entity:
```
Error
TypeError
Message
Cannot read properties of null (reading 'match')
Stack Trace
TypeError: Cannot read properties of null (reading 'match')
at https://my-backstage/static/59095.b699b2a5.chunk.js:1:8710
at Array.map ()
at eb (https://my-backstage/static/59095.b699b2a5.chunk.js:1:8688)
at eL (https://my-backstage/static/59095.b699b2a5.chunk.js:1:11637)
at ak (https://my-backstage/static/module-react-dom.e1bd40b4.js:1:60998)
at i (https://my-backstage/static/module-react-dom.e1bd40b4.js:1:119422)
at oO (https://my-backstagestatic/module-react-dom.e1bd40b4.js:1:99099)
at oD (https://my-backstage/static/module-react-dom.e1bd40b4.js:1:98969)
at oE (https://omy-backstage/static/module-react-dom.e1bd40b4.js:1:95740)
at ox (https://my-backstage/static/module-react-dom.e1bd40b4.js:1:94295)
```
The crash happens at https://github.com/drodil/backstage/blob/fa232da3244b01daba3b87f463b3944bd25605a2/plugins/catalog-react/src/components/InspectEntityDialog/components/OverviewPage.tsx#L107
### 👍 Expected Behavior
It should not crash the UI. Also, it should probably not allow annotations with null values at all in the database. I think the same applies to labels.
### 📦 Reproduction Repo
_No response_
### 🥾 Reproduction steps
1. Create entity with null value in annotations
2. Go to entity page and select Inspect entity
### Have you read the Code of Conduct?
- [x] I have read the [Code of Conduct](https://github.com/backstage/backstage/blob/master/CODE_OF_CONDUCT.md)
### Are you willing to submit PR?
Undecided
Contributor guide
Research direction
Start at plugins/catalog-react/src/components/InspectEntityDialog/components/OverviewPage.tsx, especially the referenced line where annotation values are processed. Reproduce the issue with an entity containing a null annotation and inspect the surrounding rendering path. Done means opening Inspect entity no longer crashes when annotations contain null values; database validation for annotations or labels is a separate consideration from the reported UI failure.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 70/100