backstage / backstage/backstage
TechDocs not using custom component for NotFoundErrorPage consistently
- Dominant language
- TypeScript
- Stars
- 34.4k
- Forks
- 7.6k
- Avg merge
- 2d 16h
- Merged PRs (30d)
- 211
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
TechDocs NotFound Page
```
### 🗃️ Project Area
TechDocs
### 🔗 External Integration
N/A
### 📝 Description & Context
Backstage allows apps to register a custom NotFoundErrorPage component, which should be used instead of the default. TechDocs, however, does not consistently use this custom component. This results in an inconsistent user experience where users are unexpectedly shown the custom Spotify MicDrop page.
A similar issue was raised here: https://github.com/backstage/backstage/issues/24443
. That issue was closed as “not planned”, despite interest from both maintainers and contributors. I’m happy to continue the discussion there if that’s more appropriate.
Bumping this here because this appears to be a fairly straightforward fix and it has a notably negative impact on our portal’s UX.
Currently `TechDocsReaderPageContent` already has this code:
```typescript
const app = useApp();
const { NotFoundErrorPage } = app.getComponents();
```
It then uses it in the code as follows:
```typescript
// No entity metadata = 404. Don't render content at all.
if (entityMetadataLoading === false && !entityMetadata)
return ;
```
This is good. _However_ that component then renders ``.
And that component simply renders the following when `state === 'CONTENT_NOT_FOUND'`
```
```
It seems trivial to either get the right component from `app.getComponents` inside `TechDocsStateIndicator` or pass it down as a prop. We would be more than happy to contribute a PR.
### 👍 Expected Behavior
- when you register a custom NotFoundErrorPage component in your app
- it should be consistently use everywhere in the app, including in TechDocs when a page is not found
### 📦 Reproduction Repo
_No response_
### 🥾 Reproduction steps
See issue description and related issue
### 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?
Yes, and I have enough information to get started
Contributor guide
Research direction
Start in TechDocsReaderPageContent and TechDocsStateIndicator, following the existing useApp() and NotFoundErrorPage handling into the CONTENT_NOT_FOUND state. Check the related TechDocsNotFound rendering and any nearby tests, then verify that a registered custom NotFoundErrorPage is shown consistently when TechDocs content is missing.
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
- Active
- Clarity
- Clearly specified
- Newbie friendliness
- 78/100