paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 38 Packages Projects Releases Wiki Activity

refactor: apply review suggestions

Browse Source 
Signed-off-by: Camila Belo <camilaibs@gmail.com>
This commit is contained in:
Camila Belo
2022-05-19 17:32:23 +02:00
parent 881fbd7e8d
commit 1e5d66f701
4 changed files with 68 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/fair-grapes-joke.md
+42 -1
View File
@@ -2,4 +2,45 @@
'@backstage/create-app': patch
---
Register the `TechDocs` addons on the catalog page and also test their rendering in `EntityDocs` sub pages.
Register `TechDocs` addons on catalog entity pages, follow the steps below to add them manually:
```diff
// packages/app/src/components/catalog/EntityPage.tsx
+ import { TechDocsAddons } from '@backstage/plugin-techdocs-react';
+ import {
+ ReportIssue,
+ } from '@backstage/plugin-techdocs-module-addons-contrib';
+ const techdocsContent = (
+ <EntityTechdocsContent>
+ <TechDocsAddons>
+ <ReportIssue />
+ </TechDocsAddons>
+ </EntityTechdocsContent>
+ );
const defaultEntityPage = (
...
<EntityLayout.Route path="/docs" title="Docs">
+ {techdocsContent}
</EntityLayout.Route>
...
);
const serviceEntityPage = (
...
<EntityLayout.Route path="/docs" title="Docs">
+ {techdocsContent}
</EntityLayout.Route>
...
);
const websiteEntityPage = (
...
<EntityLayout.Route path="/docs" title="Docs">
+ {techdocsContent}
</EntityLayout.Route>
...
);
```
.changeset/techdocs-buttons-film.md
+1 -1
View File
@@ -2,4 +2,4 @@
'@backstage/plugin-techdocs': patch
---
Fix `EntityDocs` component to use objects instead of `<Route>` elements, otherwise "outlet" will be null on sub-pages and add-ons won't render.
Fix `EntityTechdocsContent` component to use objects instead of `<Route>` elements, otherwise "outlet" will be null on sub-pages and add-ons won't render.
packages/app/src/components/catalog/EntityPage.tsx
+13 -18
View File
@@ -174,6 +174,15 @@ const EntityLayoutWrapper = (props: { children?: ReactNode }) => {
);
};
const techdocsContent = (
<EntityTechdocsContent>
<TechDocsAddons>
<TextSize />
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
);
/**
* NOTE: This page is designed to work on small screens such as mobile devices.
* This is based on Material UI Grid. If breakpoints are used, each grid item must set the `xs` prop to a column size or to `true`,
@@ -404,12 +413,7 @@ const serviceEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<TextSize />
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
<EntityLayout.Route
@@ -476,13 +480,9 @@ const websiteEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<TextSize />
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
<EntityLayout.Route
if={isNewRelicDashboardAvailable}
path="/newrelic-dashboard"
@@ -528,12 +528,7 @@ const defaultEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<TextSize />
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
<EntityLayout.Route path="/todos" title="TODOs">
packages/create-app/templates/default-app/packages/app/src/components/catalog/EntityPage.tsx
+12 -18
View File
@@ -69,9 +69,15 @@ import {
} from '@backstage/catalog-model';
import { TechDocsAddons } from '@backstage/plugin-techdocs-react';
import {
ReportIssue,
} from '@backstage/plugin-techdocs-module-addons-contrib';
import { ReportIssue } from '@backstage/plugin-techdocs-module-addons-contrib';
const techdocsContent = (
<EntityTechdocsContent>
<TechDocsAddons>
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
);
const cicdContent = (
// This is an example of how you can implement your company's logic in entity page.
@@ -172,11 +178,7 @@ const serviceEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
</EntityLayout>
);
@@ -203,11 +205,7 @@ const websiteEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
</EntityLayout>
);
@@ -226,11 +224,7 @@ const defaultEntityPage = (
</EntityLayout.Route>
<EntityLayout.Route path="/docs" title="Docs">
<EntityTechdocsContent>
<TechDocsAddons>
<ReportIssue />
</TechDocsAddons>
</EntityTechdocsContent>
{techdocsContent}
</EntityLayout.Route>
</EntityLayout>
);