From 283e71c935c4901ba2da4dfa905633caf317f89d Mon Sep 17 00:00:00 2001 From: Sebastian Qvarfordt Date: Thu, 4 Jun 2020 12:47:02 +0200 Subject: [PATCH 1/4] WIP --- plugins/catalog/src/data/component.ts | 3 ++- plugins/catalog/src/data/{utils.ts => utils.tsx} | 9 ++++++++- 2 files changed, 10 insertions(+), 2 deletions(-) rename plugins/catalog/src/data/{utils.ts => utils.tsx} (74%) diff --git a/plugins/catalog/src/data/component.ts b/plugins/catalog/src/data/component.ts index 1a7935a196..692176a468 100644 --- a/plugins/catalog/src/data/component.ts +++ b/plugins/catalog/src/data/component.ts @@ -13,11 +13,12 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import React from 'react'; import { Location } from '@backstage/catalog-model'; export type Component = { name: string; kind: string; - description: string; + description: React.ReactNode; location?: Location; }; diff --git a/plugins/catalog/src/data/utils.ts b/plugins/catalog/src/data/utils.tsx similarity index 74% rename from plugins/catalog/src/data/utils.ts rename to plugins/catalog/src/data/utils.tsx index fe2ec62493..71661ead53 100644 --- a/plugins/catalog/src/data/utils.ts +++ b/plugins/catalog/src/data/utils.tsx @@ -13,8 +13,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import React from 'react'; import { Component } from './component'; import { Entity, Location } from '@backstage/catalog-model'; +import Edit from '@material-ui/icons/Edit'; export function envelopeToComponent( envelope: Entity, @@ -23,7 +25,12 @@ export function envelopeToComponent( return { name: envelope.metadata?.name ?? '', kind: envelope.kind ?? 'unknown', - description: envelope.metadata?.annotations?.description ?? 'placeholder', + description: ( + + {envelope.metadata?.annotations?.description ?? 'placeholder'} + + + ), location, }; } From 2020979780f0f76975e42e02b6b04db2eb9d4adb Mon Sep 17 00:00:00 2001 From: Sebastian Qvarfordt Date: Thu, 4 Jun 2020 12:47:02 +0200 Subject: [PATCH 2/4] WIP --- plugins/catalog/src/data/component.ts | 3 ++- plugins/catalog/src/data/{utils.ts => utils.tsx} | 9 ++++++++- 2 files changed, 10 insertions(+), 2 deletions(-) rename plugins/catalog/src/data/{utils.ts => utils.tsx} (74%) diff --git a/plugins/catalog/src/data/component.ts b/plugins/catalog/src/data/component.ts index 1a7935a196..692176a468 100644 --- a/plugins/catalog/src/data/component.ts +++ b/plugins/catalog/src/data/component.ts @@ -13,11 +13,12 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import React from 'react'; import { Location } from '@backstage/catalog-model'; export type Component = { name: string; kind: string; - description: string; + description: React.ReactNode; location?: Location; }; diff --git a/plugins/catalog/src/data/utils.ts b/plugins/catalog/src/data/utils.tsx similarity index 74% rename from plugins/catalog/src/data/utils.ts rename to plugins/catalog/src/data/utils.tsx index fe2ec62493..71661ead53 100644 --- a/plugins/catalog/src/data/utils.ts +++ b/plugins/catalog/src/data/utils.tsx @@ -13,8 +13,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import React from 'react'; import { Component } from './component'; import { Entity, Location } from '@backstage/catalog-model'; +import Edit from '@material-ui/icons/Edit'; export function envelopeToComponent( envelope: Entity, @@ -23,7 +25,12 @@ export function envelopeToComponent( return { name: envelope.metadata?.name ?? '', kind: envelope.kind ?? 'unknown', - description: envelope.metadata?.annotations?.description ?? 'placeholder', + description: ( + + {envelope.metadata?.annotations?.description ?? 'placeholder'} + + + ), location, }; } From c2369b7be68c659b1367a141a91b77cf3c8859bb Mon Sep 17 00:00:00 2001 From: Sebastian Qvarfordt Date: Thu, 4 Jun 2020 17:05:51 +0200 Subject: [PATCH 3/4] Added working link button --- plugins/catalog/src/data/utils.tsx | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/plugins/catalog/src/data/utils.tsx b/plugins/catalog/src/data/utils.tsx index 71661ead53..dc72f1ce14 100644 --- a/plugins/catalog/src/data/utils.tsx +++ b/plugins/catalog/src/data/utils.tsx @@ -17,6 +17,13 @@ import React from 'react'; import { Component } from './component'; import { Entity, Location } from '@backstage/catalog-model'; import Edit from '@material-ui/icons/Edit'; +import IconButton from '@material-ui/core/IconButton'; +import { styled } from '@material-ui/core/styles'; + +const DescriptionWrapper = styled('span')({ + display: 'flex', + alignItems: 'center', +}); export function envelopeToComponent( envelope: Entity, @@ -26,10 +33,14 @@ export function envelopeToComponent( name: envelope.metadata?.name ?? '', kind: envelope.kind ?? 'unknown', description: ( - + {envelope.metadata?.annotations?.description ?? 'placeholder'} - - + + + + + + ), location, }; From 2f474224b0a9e7393021af7ca8011161860d102e Mon Sep 17 00:00:00 2001 From: Sebastian Qvarfordt Date: Fri, 5 Jun 2020 11:03:30 +0200 Subject: [PATCH 4/4] Replace blob with edit in link --- plugins/catalog/src/data/utils.tsx | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/plugins/catalog/src/data/utils.tsx b/plugins/catalog/src/data/utils.tsx index dc72f1ce14..8c2476f867 100644 --- a/plugins/catalog/src/data/utils.tsx +++ b/plugins/catalog/src/data/utils.tsx @@ -25,6 +25,8 @@ const DescriptionWrapper = styled('span')({ alignItems: 'center', }); +const createEditLink = (url: string): string => url.replace('blob', 'edit'); + export function envelopeToComponent( envelope: Entity, location?: Location, @@ -35,11 +37,13 @@ export function envelopeToComponent( description: ( {envelope.metadata?.annotations?.description ?? 'placeholder'} - - - - - + {location?.target ? ( + + + + + + ) : null} ), location,