diff --git a/plugins/azure-devops/README.md b/plugins/azure-devops/README.md
index 97a415d8d0..55d5ea5f91 100644
--- a/plugins/azure-devops/README.md
+++ b/plugins/azure-devops/README.md
@@ -81,12 +81,12 @@ To get the frontend working you'll need to do the following two steps:
yarn add @backstage/plugin-azure-devops
```
-2. Second we need to add the `EntityAzureDevOpsContent` extension to the entity page in your app:
+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 {
- EntityAzureDevOpsContent,
+ EntityAzurePipelinesContent,
isAzureDevOpsAvailable,
} from '@backstage/plugin-azure-devops';
@@ -95,7 +95,7 @@ const cicdContent = (
// ...
-
+
// ...
diff --git a/plugins/azure-devops/package.json b/plugins/azure-devops/package.json
index 16e8f35991..16008090b7 100644
--- a/plugins/azure-devops/package.json
+++ b/plugins/azure-devops/package.json
@@ -35,7 +35,7 @@
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "4.0.0-alpha.57",
"azure-devops-node-api": "^11.0.1",
- "moment": "^2.29.1",
+ "luxon": "^2.0.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-router": "6.0.0-beta.0",
diff --git a/plugins/azure-devops/src/api/AzureDevOpsClient.ts b/plugins/azure-devops/src/api/AzureDevOpsClient.ts
index 32a563f429..d82dfbe09e 100644
--- a/plugins/azure-devops/src/api/AzureDevOpsClient.ts
+++ b/plugins/azure-devops/src/api/AzureDevOpsClient.ts
@@ -36,15 +36,15 @@ export class AzureDevOpsClient implements AzureDevOpsApi {
repoName: string,
top: number,
): Promise {
- return await this.get(`/repo-builds/${projectName}/${repoName}?top=${top}`);
+ return await this.get(`repo-builds/${projectName}/${repoName}?top=${top}`);
}
private async get(path: string): Promise {
- const baseUrl = await this.discoveryApi.getBaseUrl('azure-devops');
- const url = `${baseUrl}/${path}`;
+ const baseUrl = `${await this.discoveryApi.getBaseUrl('azure-devops')}/`;
+ const url = new URL(path, baseUrl);
const idToken = await this.identityApi.getIdToken();
- const response = await fetch(url, {
+ const response = await fetch(url.toString(), {
headers: idToken ? { Authorization: `Bearer ${idToken}` } : {},
});
diff --git a/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx b/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx
index e853662fbf..7c3e09c66c 100644
--- a/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx
+++ b/plugins/azure-devops/src/components/BuildTable/BuildTable.tsx
@@ -15,7 +15,7 @@
*/
import React from 'react';
-import moment from 'moment';
+import { DateTime } from 'luxon';
import {
Table,
TableColumn,
@@ -56,7 +56,7 @@ const columns: TableColumn[] = [
title: 'ID',
field: 'id',
highlight: false,
- width: '80px',
+ width: '100px',
},
{
title: 'Build',
@@ -99,7 +99,10 @@ const columns: TableColumn[] = [
{
title: 'Date',
field: 'queueTime',
- render: (row: Partial) => moment(row.queueTime).fromNow(),
+ render: (row: Partial) =>
+ DateTime.fromISO(
+ row.queueTime ? row.queueTime.toString() : new Date().toString(),
+ ).toRelative(),
},
];
diff --git a/plugins/azure-devops/src/components/EntityPageAzureDevOps/EntityPageAzureDevOps.tsx b/plugins/azure-devops/src/components/EntityPageAzurePipelines/EntityPageAzurePipelines.tsx
similarity index 94%
rename from plugins/azure-devops/src/components/EntityPageAzureDevOps/EntityPageAzureDevOps.tsx
rename to plugins/azure-devops/src/components/EntityPageAzurePipelines/EntityPageAzurePipelines.tsx
index 8e102e647d..5d53df928c 100644
--- a/plugins/azure-devops/src/components/EntityPageAzureDevOps/EntityPageAzureDevOps.tsx
+++ b/plugins/azure-devops/src/components/EntityPageAzurePipelines/EntityPageAzurePipelines.tsx
@@ -25,7 +25,7 @@ type Props = {
entity?: Entity;
};
-export const EntityPageAzureDevOps = (_props: Props) => {
+export const EntityPageAzurePipelines = (_props: Props) => {
const { entity } = useEntity();
const { items, loading, error } = useRepoBuilds(entity);
diff --git a/plugins/azure-devops/src/components/EntityPageAzureDevOps/index.ts b/plugins/azure-devops/src/components/EntityPageAzurePipelines/index.ts
similarity index 89%
rename from plugins/azure-devops/src/components/EntityPageAzureDevOps/index.ts
rename to plugins/azure-devops/src/components/EntityPageAzurePipelines/index.ts
index 89ee4f199b..c907c61b2c 100644
--- a/plugins/azure-devops/src/components/EntityPageAzureDevOps/index.ts
+++ b/plugins/azure-devops/src/components/EntityPageAzurePipelines/index.ts
@@ -14,4 +14,4 @@
* limitations under the License.
*/
-export { EntityPageAzureDevOps } from './EntityPageAzureDevOps';
+export { EntityPageAzurePipelines } from './EntityPageAzurePipelines';
diff --git a/plugins/azure-devops/src/components/Router.tsx b/plugins/azure-devops/src/components/Router.tsx
index 74cf0439f8..81b6d89a25 100644
--- a/plugins/azure-devops/src/components/Router.tsx
+++ b/plugins/azure-devops/src/components/Router.tsx
@@ -16,7 +16,7 @@
import React from 'react';
import { Routes, Route } from 'react-router';
import { azureDevOpsRouteRef } from '../routes';
-import { EntityPageAzureDevOps } from './EntityPageAzureDevOps';
+import { EntityPageAzurePipelines } from './EntityPageAzurePipelines';
import { AZURE_DEVOPS_ANNOTATION } from '../constants';
import { Entity } from '@backstage/catalog-model';
import { useEntity } from '@backstage/plugin-catalog-react';
@@ -41,7 +41,7 @@ export const Router = (_props: Props) => {
}
+ element={}
/>
);
diff --git a/plugins/azure-devops/src/plugin.ts b/plugins/azure-devops/src/plugin.ts
index 9ec5ebbb09..1cf6e680d0 100644
--- a/plugins/azure-devops/src/plugin.ts
+++ b/plugins/azure-devops/src/plugin.ts
@@ -42,7 +42,7 @@ export const azureDevOpsPlugin = createPlugin({
export const EntityAzurePipelinesContent = azureDevOpsPlugin.provide(
createRoutableExtension({
- name: 'EntityAzureDevOpsContent',
+ name: 'EntityAzurePipelinesContent',
component: () => import('./components/Router').then(m => m.Router),
mountPoint: azureDevOpsRouteRef,
}),