fix(github-actions): cards

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

@@ -74,7 +74,7 @@ const WidgetContent = ({
   );
 };
 
-export const Widget = ({
+export const LatestWorkflowRunCard = ({
   entity,
   branch = 'master',
 }: {
@@ -109,50 +109,14 @@ export const Widget = ({
   );
 };
 
-const RecentWorkflowRunsCardContent = ({
-  error,
-  loading,
-  branch,
-}: {
-  error?: Error;
-  loading?: boolean;
-  branch: string;
-}) => {
-  if (error) return <Typography>Couldn't fetch {branch} runs</Typography>;
-  if (loading) return <LinearProgress />;
-  return <WorkflowRunsTable />;
-};
-
-export const RecentWorkflowRunsCard = ({
+export const LatestWorkflowsForBranchCard = ({
   entity,
   branch = 'master',
 }: {
   entity: Entity;
   branch: string;
-}) => {
-  const errorApi = useApi(errorApiRef);
-  const [owner, repo] = (
-    entity?.metadata.annotations?.['backstage.io/github-actions-id'] ?? '/'
-  ).split('/');
-  const [{ loading, error }] = useWorkflowRuns({
-    owner,
-    repo,
-    branch,
-  });
-
-  useEffect(() => {
-    if (error) {
-      errorApi.post(error);
-    }
-  }, [error, errorApi]);
-
-  return (
-    <InfoCard title={`${branch} builds`}>
-      <RecentWorkflowRunsCardContent
-        error={error}
-        loading={loading}
-        branch={branch}
-      />
-    </InfoCard>
-  );
-};
+}) => (
+  <InfoCard title={`Last ${branch} build`}>
+    <WorkflowRunsTable branch={branch} entity={entity} />
+  </InfoCard>
+);

plugins/github-actions/src/components/Cards/index.ts

@@ -13,4 +13,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-export { Widget, RecentWorkflowRunsCard } from './Widget';
+export { LatestWorkflowRunCard, LatestWorkflowsForBranchCard } from './Cards';

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

@@ -23,7 +23,6 @@ import { useWorkflowRuns } from '../useWorkflowRuns';
 import { WorkflowRunStatus } from '../WorkflowRunStatus';
 import SyncIcon from '@material-ui/icons/Sync';
 import { buildRouteRef } from '../../plugin';
-import { useEntityCompoundName } from '@backstage/plugin-catalog';
 import { useProjectName } from '../useProjectName';
 import { Entity } from '@backstage/catalog-model';
 
@@ -148,12 +147,19 @@ export const WorkflowRunsTableView: FC<Props> = ({
   );
 };
 
-export const WorkflowRunsTable = ({ entity }: { entity: Entity }) => {
+export const WorkflowRunsTable = ({
+  entity,
+  branch,
+}: {
+  entity: Entity;
+  branch?: string;
+}) => {
   const { value: projectName, loading } = useProjectName(entity);
   const [owner, repo] = (projectName ?? '/').split('/');
   const [tableProps, { retry, setPage, setPageSize }] = useWorkflowRuns({
     owner,
     repo,
+    branch,
   });
 
   return (

plugins/github-actions/src/index.ts

@@ -17,4 +17,5 @@
 export { plugin } from './plugin';
 export * from './api';
 export { Router } from './components/Router';
+export * from './components/Cards';
 export { GITHUB_ACTIONS_ANNOTATION } from './components/useProjectName';