Merge branch 'master' into rugvip/test-port

plugins/github-actions/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @backstage/plugin-github-actions
 
+## 0.4.24
+
+### Patch Changes
+
+- a125278b81: Refactor out the deprecated path and icon from RouteRefs
+- Updated dependencies
+  - @backstage/catalog-model@0.9.7
+  - @backstage/plugin-catalog-react@0.6.4
+  - @backstage/core-components@0.7.4
+  - @backstage/core-plugin-api@0.2.0
+
 ## 0.4.23
 
 ### Patch Changes

plugins/github-actions/README.md

@@ -11,7 +11,7 @@ TBD
 ### Generic Requirements
 
 1. Provide OAuth credentials:
-   1. [Create an OAuth App](https://developer.github.com/apps/building-oauth-apps/creating-an-oauth-app/) with the callback URL set to `http://localhost:7000/api/auth/github`.
+   1. [Create an OAuth App](https://developer.github.com/apps/building-oauth-apps/creating-an-oauth-app/) with the callback URL set to `http://localhost:7007/api/auth/github`.
    2. Take the Client ID and Client Secret from the newly created app's settings page and put them into `AUTH_GITHUB_CLIENT_ID` and `AUTH_GITHUB_CLIENT_SECRET` environment variables.
 2. Annotate your component with a correct GitHub Actions repository and owner:
 

plugins/github-actions/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@backstage/plugin-github-actions",
   "description": "A Backstage plugin that integrates towards GitHub Actions",
-  "version": "0.4.23",
+  "version": "0.4.24",
   "main": "src/index.ts",
   "types": "src/index.ts",
   "license": "Apache-2.0",
@@ -33,11 +33,11 @@
     "clean": "backstage-cli clean"
   },
   "dependencies": {
-    "@backstage/catalog-model": "^0.9.5",
-    "@backstage/core-components": "^0.7.3",
-    "@backstage/core-plugin-api": "^0.1.13",
+    "@backstage/catalog-model": "^0.9.7",
+    "@backstage/core-components": "^0.7.4",
+    "@backstage/core-plugin-api": "^0.2.0",
     "@backstage/integration": "^0.6.8",
-    "@backstage/plugin-catalog-react": "^0.6.3",
+    "@backstage/plugin-catalog-react": "^0.6.4",
     "@backstage/theme": "^0.2.13",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.9.1",
@@ -52,10 +52,10 @@
     "react-use": "^17.2.4"
   },
   "devDependencies": {
-    "@backstage/cli": "^0.8.2",
-    "@backstage/core-app-api": "^0.1.20",
-    "@backstage/dev-utils": "^0.2.12",
-    "@backstage/test-utils": "^0.1.21",
+    "@backstage/cli": "^0.9.0",
+    "@backstage/core-app-api": "^0.1.22",
+    "@backstage/dev-utils": "^0.2.13",
+    "@backstage/test-utils": "^0.1.22",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^11.2.5",
     "@testing-library/user-event": "^13.1.8",

plugins/github-actions/src/components/Router.tsx

@@ -17,7 +17,7 @@ import React from 'react';
 import { Entity } from '@backstage/catalog-model';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { Routes, Route } from 'react-router';
-import { rootRouteRef, buildRouteRef } from '../routes';
+import { buildRouteRef } from '../routes';
 import { WorkflowRunDetails } from './WorkflowRunDetails';
 import { WorkflowRunsTable } from './WorkflowRunsTable';
 import { GITHUB_ACTIONS_ANNOTATION } from './useProjectName';
@@ -41,12 +41,9 @@ export const Router = (_props: Props) => {
   }
   return (
     <Routes>
+      <Route path="/" element={<WorkflowRunsTable entity={entity} />} />
       <Route
-        path={`/${rootRouteRef.path}`}
-        element={<WorkflowRunsTable entity={entity} />}
-      />
-      <Route
-        path={`/${buildRouteRef.path}`}
+        path={`${buildRouteRef.path}`}
         element={<WorkflowRunDetails entity={entity} />}
       />
       )

plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx

@@ -24,7 +24,7 @@ import {
 } from '@material-ui/core';
 import RetryIcon from '@material-ui/icons/Replay';
 import GitHubIcon from '@material-ui/icons/GitHub';
-import { Link as RouterLink, generatePath } from 'react-router-dom';
+import { Link as RouterLink } from 'react-router-dom';
 import { useWorkflowRuns, WorkflowRun } from '../useWorkflowRuns';
 import { WorkflowRunStatus } from '../WorkflowRunStatus';
 import SyncIcon from '@material-ui/icons/Sync';
@@ -34,7 +34,7 @@ import { Entity } from '@backstage/catalog-model';
 import { readGitHubIntegrationConfigs } from '@backstage/integration';
 
 import { EmptyState, Table, TableColumn } from '@backstage/core-components';
-import { configApiRef, useApi } from '@backstage/core-plugin-api';
+import { configApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api';
 
 const generatedColumns: TableColumn[] = [
   {
@@ -47,14 +47,18 @@ const generatedColumns: TableColumn[] = [
     title: 'Message',
     field: 'message',
     highlight: true,
-    render: (row: Partial<WorkflowRun>) => (
-      <Link
-        component={RouterLink}
-        to={generatePath(buildRouteRef.path, { id: row.id! })}
-      >
-        {row.message}
-      </Link>
-    ),
+    render: (row: Partial<WorkflowRun>) => {
+      const LinkWrapper = () => {
+        const routeLink = useRouteRef(buildRouteRef);
+        return (
+          <Link component={RouterLink} to={routeLink({ id: row.id! })}>
+            {row.message}
+          </Link>
+        );
+      };
+
+      return <LinkWrapper />;
+    },
   },
   {
     title: 'Source',

plugins/github-actions/src/routes.ts

@@ -14,15 +14,14 @@
  * limitations under the License.
  */
 
-import { createRouteRef } from '@backstage/core-plugin-api';
+import { createRouteRef, createSubRouteRef } from '@backstage/core-plugin-api';
 
 export const rootRouteRef = createRouteRef({
-  path: '',
-  title: 'GitHub Actions',
+  id: 'github-actions',
 });
 
-export const buildRouteRef = createRouteRef({
-  path: ':id',
-  params: ['id'],
-  title: 'GitHub Actions Workflow Run',
+export const buildRouteRef = createSubRouteRef({
+  id: 'github-actions/build',
+  path: '/:id',
+  parent: rootRouteRef,
 });