diff --git a/.changeset/tall-planes-grow.md b/.changeset/tall-planes-grow.md new file mode 100644 index 0000000000..d5e07256c9 --- /dev/null +++ b/.changeset/tall-planes-grow.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-github-actions': patch +--- + +Fixed an issue where an error message was being displayed on the initial component render. This was due to values owner/repo not yet being set. diff --git a/plugins/github-actions/src/components/Cards/Cards.tsx b/plugins/github-actions/src/components/Cards/Cards.tsx index cb4b2190fc..c3df91bca6 100644 --- a/plugins/github-actions/src/components/Cards/Cards.tsx +++ b/plugins/github-actions/src/components/Cards/Cards.tsx @@ -24,7 +24,7 @@ import { } from '@material-ui/core'; import ExternalLinkIcon from '@material-ui/icons/Launch'; import React, { useEffect } from 'react'; -import { GITHUB_ACTIONS_ANNOTATION } from '../useProjectName'; +import { GITHUB_ACTIONS_ANNOTATION } from '../getProjectNameFromEntity'; import { useWorkflowRuns, WorkflowRun } from '../useWorkflowRuns'; import { WorkflowRunsTable } from '../WorkflowRunsTable'; import { WorkflowRunStatus } from '../WorkflowRunStatus'; diff --git a/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.tsx b/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.tsx index 3423bea84d..12c3223d83 100644 --- a/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.tsx +++ b/plugins/github-actions/src/components/Cards/RecentWorkflowRunsCard.tsx @@ -18,7 +18,7 @@ import { readGitHubIntegrationConfigs } from '@backstage/integration'; import { useEntity } from '@backstage/plugin-catalog-react'; import React, { useEffect } from 'react'; import { generatePath, Link as RouterLink } from 'react-router-dom'; -import { GITHUB_ACTIONS_ANNOTATION } from '../useProjectName'; +import { GITHUB_ACTIONS_ANNOTATION } from '../getProjectNameFromEntity'; import { useWorkflowRuns } from '../useWorkflowRuns'; import { WorkflowRunStatus } from '../WorkflowRunStatus'; import { Typography } from '@material-ui/core'; diff --git a/plugins/github-actions/src/components/Router.tsx b/plugins/github-actions/src/components/Router.tsx index ea07213c45..251ecb169a 100644 --- a/plugins/github-actions/src/components/Router.tsx +++ b/plugins/github-actions/src/components/Router.tsx @@ -20,7 +20,7 @@ import { Routes, Route } from 'react-router'; import { buildRouteRef } from '../routes'; import { WorkflowRunDetails } from './WorkflowRunDetails'; import { WorkflowRunsTable } from './WorkflowRunsTable'; -import { GITHUB_ACTIONS_ANNOTATION } from './useProjectName'; +import { GITHUB_ACTIONS_ANNOTATION } from './getProjectNameFromEntity'; import { MissingAnnotationEmptyState } from '@backstage/core-components'; export const isGithubActionsAvailable = (entity: Entity) => diff --git a/plugins/github-actions/src/components/WorkflowRunDetails/WorkflowRunDetails.tsx b/plugins/github-actions/src/components/WorkflowRunDetails/WorkflowRunDetails.tsx index aebf7dfa01..989ab27800 100644 --- a/plugins/github-actions/src/components/WorkflowRunDetails/WorkflowRunDetails.tsx +++ b/plugins/github-actions/src/components/WorkflowRunDetails/WorkflowRunDetails.tsx @@ -39,7 +39,7 @@ import ExternalLinkIcon from '@material-ui/icons/Launch'; import { DateTime } from 'luxon'; import React from 'react'; import { Job, Jobs, Step } from '../../api'; -import { useProjectName } from '../useProjectName'; +import { getProjectNameFromEntity } from '../getProjectNameFromEntity'; import { WorkflowRunStatus } from '../WorkflowRunStatus'; import { useWorkflowRunJobs } from './useWorkflowRunJobs'; import { useWorkflowRunsDetails } from './useWorkflowRunsDetails'; @@ -164,25 +164,25 @@ const JobsList = ({ jobs, entity }: { jobs?: Jobs; entity: Entity }) => { export const WorkflowRunDetails = ({ entity }: { entity: Entity }) => { const config = useApi(configApiRef); - const projectName = useProjectName(entity); + const projectName = getProjectNameFromEntity(entity); // TODO: Get github hostname from metadata annotation const hostname = readGitHubIntegrationConfigs( config.getOptionalConfigArray('integrations.github') ?? [], )[0].host; - const [owner, repo] = projectName.value ? projectName.value.split('/') : []; + const [owner, repo] = (projectName && projectName.split('/')) || []; const details = useWorkflowRunsDetails({ hostname, owner, repo }); const jobs = useWorkflowRunJobs({ hostname, owner, repo }); - const error = projectName.error || (projectName.value && details.error); const classes = useStyles(); - if (error) { + + if (details.error && details.error.message) { return ( - Failed to load build, {error.message} + Failed to load build, {details.error.message} ); - } else if (projectName.loading || details.loading) { + } else if (details.loading) { return ; } return ( diff --git a/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts b/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts index 002d379ed1..ba0f3b6ba8 100644 --- a/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts +++ b/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunJobs.ts @@ -37,7 +37,7 @@ export const useWorkflowRunJobs = ({ repo, id: parseInt(id, 10), }) - : Promise.reject('No repo/owner provided'); + : Promise.reject(new Error('No repo/owner provided')); }, [repo, owner, id]); return jobs; }; diff --git a/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts b/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts index ef9b4f7ccf..10a043161e 100644 --- a/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts +++ b/plugins/github-actions/src/components/WorkflowRunDetails/useWorkflowRunsDetails.ts @@ -37,7 +37,7 @@ export const useWorkflowRunsDetails = ({ repo, id: parseInt(id, 10), }) - : Promise.reject('No repo/owner provided'); + : Promise.reject(new Error('No repo/owner provided')); }, [repo, owner, id]); return details; }; diff --git a/plugins/github-actions/src/components/WorkflowRunLogs/WorkflowRunLogs.tsx b/plugins/github-actions/src/components/WorkflowRunLogs/WorkflowRunLogs.tsx index 0f1670bbbc..bf66399288 100644 --- a/plugins/github-actions/src/components/WorkflowRunLogs/WorkflowRunLogs.tsx +++ b/plugins/github-actions/src/components/WorkflowRunLogs/WorkflowRunLogs.tsx @@ -33,7 +33,7 @@ import { import DescriptionIcon from '@material-ui/icons/Description'; import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; import React from 'react'; -import { useProjectName } from '../useProjectName'; +import { getProjectNameFromEntity } from '../getProjectNameFromEntity'; import { useDownloadWorkflowRunLogs } from './useDownloadWorkflowRunLogs'; const useStyles = makeStyles(theme => ({ @@ -77,13 +77,13 @@ export const WorkflowRunLogs = ({ }) => { const config = useApi(configApiRef); const classes = useStyles(); - const projectName = useProjectName(entity); + const projectName = getProjectNameFromEntity(entity); // TODO: Get github hostname from metadata annotation const hostname = readGitHubIntegrationConfigs( config.getOptionalConfigArray('integrations.github') ?? [], )[0].host; - const [owner, repo] = projectName.value ? projectName.value.split('/') : []; + const [owner, repo] = (projectName && projectName.split('/')) || []; const jobLogs = useDownloadWorkflowRunLogs({ hostname, owner, diff --git a/plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx b/plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx index 81fa036221..c8c42eb1bc 100644 --- a/plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx +++ b/plugins/github-actions/src/components/WorkflowRunsTable/WorkflowRunsTable.tsx @@ -29,7 +29,7 @@ import { useWorkflowRuns, WorkflowRun } from '../useWorkflowRuns'; import { WorkflowRunStatus } from '../WorkflowRunStatus'; import SyncIcon from '@material-ui/icons/Sync'; import { buildRouteRef } from '../../routes'; -import { useProjectName } from '../useProjectName'; +import { getProjectNameFromEntity } from '../getProjectNameFromEntity'; import { Entity } from '@backstage/catalog-model'; import { readGitHubIntegrationConfigs } from '@backstage/integration'; @@ -157,7 +157,7 @@ export const WorkflowRunsTable = ({ branch?: string; }) => { const config = useApi(configApiRef); - const { value: projectName, loading } = useProjectName(entity); + const projectName = getProjectNameFromEntity(entity); // TODO: Get github hostname from metadata annotation const hostname = readGitHubIntegrationConfigs( config.getOptionalConfigArray('integrations.github') ?? [], @@ -172,7 +172,7 @@ export const WorkflowRunsTable = ({ }); const githubHost = hostname || 'github.com'; - const hasNoRuns = !loading && !tableProps.loading && !runs; + const hasNoRuns = !tableProps.loading && !runs; return hasNoRuns ? ( { - const { value, loading, error } = useAsync(async () => { - return entity?.metadata.annotations?.[GITHUB_ACTIONS_ANNOTATION] ?? ''; - }); - return { value, loading, error }; -}; +export const getProjectNameFromEntity = (entity: Entity) => + entity?.metadata.annotations?.[GITHUB_ACTIONS_ANNOTATION] ?? ''; diff --git a/plugins/github-actions/src/index.ts b/plugins/github-actions/src/index.ts index f520b9fbbc..ab041b4970 100644 --- a/plugins/github-actions/src/index.ts +++ b/plugins/github-actions/src/index.ts @@ -35,4 +35,4 @@ export { isGithubActionsAvailable as isPluginApplicableToEntity, } from './components/Router'; export * from './components/Cards'; -export { GITHUB_ACTIONS_ANNOTATION } from './components/useProjectName'; +export { GITHUB_ACTIONS_ANNOTATION } from './components/getProjectNameFromEntity';