From 0b0876b0da3e5a97e9d9ca6e2e17d0f815251e39 Mon Sep 17 00:00:00 2001 From: Andre Wanlin Date: Fri, 8 Oct 2021 10:06:05 -0500 Subject: [PATCH] Another set of feedback improvements Signed-off-by: Andre Wanlin --- app-config.yaml | 3 +- packages/backend/src/index.ts | 2 +- .../{azuredevops.ts => azure-devops.ts} | 0 plugins/azure-devops/README.md | 39 ++++++++++--------- plugins/azure-devops/config.d.ts | 12 +++--- .../src/components/BuildTable/BuildTable.tsx | 9 ++++- .../src/hooks/useProjectRepoFromEntity.ts | 19 +++++++++ .../azure-devops/src/hooks/useRepoBuilds.ts | 3 +- 8 files changed, 58 insertions(+), 29 deletions(-) rename packages/backend/src/plugins/{azuredevops.ts => azure-devops.ts} (100%) diff --git a/app-config.yaml b/app-config.yaml index b92595df7b..645221538b 100644 --- a/app-config.yaml +++ b/app-config.yaml @@ -436,4 +436,5 @@ azureDevOps: host: dev.azure.com token: my-token organization: my-company - top: 25 + azurePipelines: + top: 25 diff --git a/packages/backend/src/index.ts b/packages/backend/src/index.ts index f25ec5a14e..b6c148dfba 100644 --- a/packages/backend/src/index.ts +++ b/packages/backend/src/index.ts @@ -38,7 +38,7 @@ import { Config } from '@backstage/config'; import healthcheck from './plugins/healthcheck'; import { metricsInit, metricsHandler } from './metrics'; import auth from './plugins/auth'; -import azureDevOps from './plugins/azuredevops'; +import azureDevOps from './plugins/azure-devops'; import catalog from './plugins/catalog'; import codeCoverage from './plugins/codecoverage'; import kubernetes from './plugins/kubernetes'; diff --git a/packages/backend/src/plugins/azuredevops.ts b/packages/backend/src/plugins/azure-devops.ts similarity index 100% rename from packages/backend/src/plugins/azuredevops.ts rename to packages/backend/src/plugins/azure-devops.ts diff --git a/plugins/azure-devops/README.md b/plugins/azure-devops/README.md index 55d5ea5f91..d2ab1b6c6f 100644 --- a/plugins/azure-devops/README.md +++ b/plugins/azure-devops/README.md @@ -17,7 +17,8 @@ azureDevOps: host: dev.azure.com token: ${AZURE_TOKEN} organization: my-company - top: 50 + azurePipelines: + top: 50 ``` Configuration Details: @@ -25,7 +26,7 @@ Configuration Details: - `host` and `token` can be the same as the ones used for the `integration` section - `AZURE_TOKEN` environment variable must be set to a [Personal Access Token](https://docs.microsoft.com/en-us/azure/devops/organizations/accounts/use-personal-access-tokens-to-authenticate?view=azure-devops&tabs=preview-page) with read access to both Code and Build - `organization` is your Azure DevOps Organization name or for Azure DevOps Server (on-premise) this will be your Collection name -- `top` is strictly used by the frontend to limit the number of items returned, currently only used for Builds +- `top` is strictly used by the frontend to limit the number of items returned, if not provided it defaults to 10. Currently only used for Builds ### Backend @@ -39,7 +40,7 @@ Here's how to get the backend up and running: yarn add @backstage/plugin-azure-devops-backend ``` -2. Then we will create a new file named `packages/backend/src/plugins/azuredevops.ts`, and add the +2. Then we will create a new file named `packages/backend/src/plugins/azure-devops.ts`, and add the following to it: ```ts @@ -83,23 +84,23 @@ To get the frontend working you'll need to do the following two steps: 2. Second we need to add the `EntityAzurePipelinesContent` extension to the entity page in your app: -```tsx -// In packages/app/src/components/catalog/EntityPage.tsx -import { - EntityAzurePipelinesContent, - isAzureDevOpsAvailable, -} from '@backstage/plugin-azure-devops'; + ```tsx + // In packages/app/src/components/catalog/EntityPage.tsx + import { + EntityAzurePipelinesContent, + isAzureDevOpsAvailable, + } from '@backstage/plugin-azure-devops'; -// For example in the CI/CD section -const cicdContent = ( - - // ... - - - - // ... - -``` + // For example in the CI/CD section + const cicdContent = ( + + // ... + + + + // ... + + ``` ### Entity Annotation diff --git a/plugins/azure-devops/config.d.ts b/plugins/azure-devops/config.d.ts index 62b1488e49..bbd42c55a1 100644 --- a/plugins/azure-devops/config.d.ts +++ b/plugins/azure-devops/config.d.ts @@ -17,10 +17,12 @@ export interface Config { /** Configuration options for the azure-devops-backend plugin */ azureDevOps: { - /** - * The max number of items to return - applies to builds - * @visibility frontend - */ - top: number; + azurePipelines: { + /** + * The max number of items to return - applies to builds + * @visibility frontend + */ + top: number; + }; }; } diff --git a/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx b/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx index 7c3e09c66c..b3d239d914 100644 --- a/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx +++ b/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx @@ -56,11 +56,12 @@ const columns: TableColumn[] = [ title: 'ID', field: 'id', highlight: false, - width: '100px', + width: 'auto', }, { title: 'Build', field: 'title', + width: 'auto', render: (row: Partial) => ( {row.title} @@ -70,10 +71,12 @@ const columns: TableColumn[] = [ { title: 'Source', field: 'source', + width: 'auto', }, { title: 'Status', field: 'status', + width: 'auto', render: (row: Partial) => ( @@ -86,6 +89,7 @@ const columns: TableColumn[] = [ { title: 'Result', field: 'result', + width: 'auto', render: (row: Partial) => ( {getBuildResultComponent(row.result)} @@ -97,8 +101,9 @@ const columns: TableColumn[] = [ ), }, { - title: 'Date', + title: 'Age', field: 'queueTime', + width: 'auto', render: (row: Partial) => DateTime.fromISO( row.queueTime ? row.queueTime.toString() : new Date().toString(), diff --git a/plugins/azure-devops/src/hooks/useProjectRepoFromEntity.ts b/plugins/azure-devops/src/hooks/useProjectRepoFromEntity.ts index dfbee81d62..418badc630 100644 --- a/plugins/azure-devops/src/hooks/useProjectRepoFromEntity.ts +++ b/plugins/azure-devops/src/hooks/useProjectRepoFromEntity.ts @@ -24,5 +24,24 @@ export function useProjectRepoFromEntity(entity: Entity): { const [project, repo] = ( entity.metadata.annotations?.[AZURE_DEVOPS_ANNOTATION] ?? '' ).split('/'); + + if (!project && !repo) { + throw new Error( + 'Value for annotation dev.azure.com/project-repo was not in the correct format: /', + ); + } + + if (!project) { + throw new Error( + 'Project Name for annotation dev.azure.com/project-repo was not found; expected format is: /', + ); + } + + if (!repo) { + throw new Error( + 'Repo Name for annotation dev.azure.com/project-repo was not found; expected format is: /', + ); + } + return { project, repo }; } diff --git a/plugins/azure-devops/src/hooks/useRepoBuilds.ts b/plugins/azure-devops/src/hooks/useRepoBuilds.ts index 1e68490ea6..0bae4b334b 100644 --- a/plugins/azure-devops/src/hooks/useRepoBuilds.ts +++ b/plugins/azure-devops/src/hooks/useRepoBuilds.ts @@ -29,7 +29,8 @@ export function useRepoBuilds(entity: Entity): { } { const config = useApi(configApiRef); const top = - config.getOptionalNumber('azureDevOps.top') ?? AZURE_DEVOPS_DEFAULT_TOP; + config.getOptionalNumber('azureDevOps.azurePipelines.top') ?? + AZURE_DEVOPS_DEFAULT_TOP; const api = useApi(azureDevOpsApiRef); const { project, repo } = useProjectRepoFromEntity(entity); const { value, loading, error } = useAsync(() => {