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

feat(scaffolder): Use more distinguishable icons for link and text output

Browse Source 
Use more distinguishable icons for link (`Link`) and text output (`Description`).

Currently, both use the same icon `Web` (until specified explicitly at the template).
For a user, it is not really clear which of these will open more output below it
vs open a URL/a new tab.

Signed-off-by: Patrick Jungermann <Patrick.Jungermann@gmail.com>
This commit is contained in:
Patrick Jungermann
2024-01-24 16:04:37 +01:00
parent f6c0fc32dc
commit b07ec70c90
3 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/twelve-hounds-know.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-scaffolder-react': minor
---
Use more distinguishable icons for link (`Link`) and text output (`Description`).
plugins/scaffolder-react/src/next/components/TemplateOutputs/LinkOutputs.tsx
+2 -2
View File
@@ -17,7 +17,7 @@ import { IconComponent, useApp, useRouteRef } from '@backstage/core-plugin-api';
import { entityRouteRef } from '@backstage/plugin-catalog-react';
import { Button, makeStyles } from '@material-ui/core';
import React from 'react';
import WebIcon from '@material-ui/icons/Web';
import LinkIcon from '@material-ui/icons/Link';
import { parseEntityRef } from '@backstage/catalog-model';
import { Link } from '@backstage/core-components';
import { ScaffolderTaskOutput } from '../../../api';
@@ -37,7 +37,7 @@ export const LinkOutputs = (props: { output: ScaffolderTaskOutput }) => {
const entityRoute = useRouteRef(entityRouteRef);
const iconResolver = (key?: string): IconComponent =>
app.getSystemIcon(key!) ?? WebIcon;
app.getSystemIcon(key!) ?? LinkIcon;
return (
<>
plugins/scaffolder-react/src/next/components/TemplateOutputs/TextOutputs.tsx
+2 -2
View File
@@ -15,7 +15,7 @@
*/
import { IconComponent, useApp } from '@backstage/core-plugin-api';
import { Button } from '@material-ui/core';
import WebIcon from '@material-ui/icons/Web';
import DescriptionIcon from '@material-ui/icons/Description';
import React from 'react';
import { ScaffolderTaskOutput } from '../../../api';
@@ -33,7 +33,7 @@ export const TextOutputs = (props: {
const app = useApp();
const iconResolver = (key?: string): IconComponent =>
app.getSystemIcon(key!) ?? WebIcon;
app.getSystemIcon(key!) ?? DescriptionIcon;
return (
<>