diff --git a/plugins/jenkins/src/components/BuildsPage/lib/CITable/CITable.tsx b/plugins/jenkins/src/components/BuildsPage/lib/CITable/CITable.tsx index 2c3660c239..1f5d272c61 100644 --- a/plugins/jenkins/src/components/BuildsPage/lib/CITable/CITable.tsx +++ b/plugins/jenkins/src/components/BuildsPage/lib/CITable/CITable.tsx @@ -13,222 +13,15 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import { Link, Progress, Table, TableColumn } from '@backstage/core-components'; -import { alertApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api'; -import { useEntityPermission } from '@backstage/plugin-catalog-react/alpha'; -import { Box, IconButton, Tooltip, Typography } from '@material-ui/core'; +import { Table, TableColumn } from '@backstage/core-components'; +import { Box, Typography } from '@material-ui/core'; import RetryIcon from '@material-ui/icons/Replay'; -import VisibilityIcon from '@material-ui/icons/Visibility'; -import { default as React, useState } from 'react'; +import { default as React } from 'react'; import { Project } from '../../../../api/JenkinsApi'; import JenkinsLogo from '../../../../assets/JenkinsLogo.svg'; -import { buildRouteRef } from '../../../../plugin'; import { useBuilds } from '../../../useBuilds'; -import { JenkinsRunStatus } from '../Status'; -import { jenkinsExecutePermission } from '@backstage/plugin-jenkins-common'; - -const FailCount = ({ count }: { count: number }): JSX.Element | null => { - if (count !== 0) { - return <>{count} failed; - } - return null; -}; - -const SkippedCount = ({ count }: { count: number }): JSX.Element | null => { - if (count !== 0) { - return <>{count} skipped; - } - return null; -}; - -const FailSkippedWidget = ({ - skipped, - failed, -}: { - skipped: number; - failed: number; -}): JSX.Element | null => { - if (skipped === 0 && failed === 0) { - return null; - } - - if (skipped !== 0 && failed !== 0) { - return ( - <> - {' '} - (, ) - - ); - } - - if (failed !== 0) { - return ( - <> - {' '} - () - - ); - } - - if (skipped !== 0) { - return ( - <> - {' '} - () - - ); - } - - return null; -}; - -export const ciTableColumns: TableColumn[] = [ - { - title: 'Timestamp', - defaultSort: 'desc', - hidden: true, - field: 'lastBuild.timestamp', - }, - { - title: 'Build', - field: 'fullName', - highlight: true, - render: (row: Partial) => { - const LinkWrapper = () => { - const routeLink = useRouteRef(buildRouteRef); - if (!row.fullName || !row.lastBuild?.number) { - return ( - <> - {row.fullName || - row.fullDisplayName || - row.displayName || - 'Unknown'} - - ); - } - - return ( - - {row.fullDisplayName} - - ); - }; - - return ; - }, - }, - { - title: 'Source', - field: 'lastBuild.source.branchName', - render: (row: Partial) => ( - <> - - - {row.lastBuild?.source?.branchName} - - - {row.lastBuild?.source?.commit?.hash} - - ), - }, - { - title: 'Status', - field: 'status', - render: (row: Partial) => { - return ( - - - - ); - }, - }, - { - title: 'Tests', - sorting: false, - render: (row: Partial) => { - return ( - <> - - {row.lastBuild?.tests && ( - - {row.lastBuild?.tests.passed} / {row.lastBuild?.tests.total}{' '} - passed - - - )} - - {!row.lastBuild?.tests && 'n/a'} - - - ); - }, - }, - { - title: 'Actions', - sorting: false, - render: (row: Partial) => { - const ActionWrapper = () => { - const [isLoadingRebuild, setIsLoadingRebuild] = useState(false); - const { allowed, loading } = useEntityPermission( - jenkinsExecutePermission, - ); - - const alertApi = useApi(alertApiRef); - - const onRebuild = async () => { - if (row.onRestartClick) { - setIsLoadingRebuild(true); - try { - await row.onRestartClick(); - alertApi.post({ - message: 'Jenkins re-build has successfully executed', - severity: 'success', - display: 'transient', - }); - } catch (e) { - alertApi.post({ - message: `Jenkins re-build has failed. Error: ${e.message}`, - severity: 'error', - }); - } finally { - setIsLoadingRebuild(false); - } - } - }; - - return ( -
- {row.lastBuild?.url && ( - - - - - - )} - {isLoadingRebuild && } - {!isLoadingRebuild && ( - - - - - - )} -
- ); - }; - return ; - }, - width: '10%', - }, -]; +import { columnFactories } from './columns'; +import { defaultCITableColumns } from './presets'; type Props = { loading: boolean; @@ -281,7 +74,9 @@ export const CITableView = ({ Projects } - columns={columns && columns.length !== 0 ? columns : ciTableColumns} + columns={ + columns && columns.length !== 0 ? columns : defaultCITableColumns + } /> ); }; @@ -303,3 +98,7 @@ export const CITable = ({ columns }: CITableProps) => { /> ); }; + +CITable.columns = columnFactories; + +CITable.defaultCITableColumns = defaultCITableColumns; diff --git a/plugins/jenkins/src/components/BuildsPage/lib/CITable/columns.tsx b/plugins/jenkins/src/components/BuildsPage/lib/CITable/columns.tsx new file mode 100644 index 0000000000..6944f7cd92 --- /dev/null +++ b/plugins/jenkins/src/components/BuildsPage/lib/CITable/columns.tsx @@ -0,0 +1,251 @@ +/* + * Copyright 2020 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { Link, Progress, Table, TableColumn } from '@backstage/core-components'; +import { alertApiRef, useApi, useRouteRef } from '@backstage/core-plugin-api'; +import { useEntityPermission } from '@backstage/plugin-catalog-react/alpha'; +import { Box, IconButton, Tooltip, Typography } from '@material-ui/core'; +import RetryIcon from '@material-ui/icons/Replay'; +import VisibilityIcon from '@material-ui/icons/Visibility'; +import { default as React, useState } from 'react'; +import { Project } from '../../../../api/JenkinsApi'; +import { buildRouteRef } from '../../../../plugin'; +import { JenkinsRunStatus } from '../Status'; +import { jenkinsExecutePermission } from '@backstage/plugin-jenkins-common'; + +const FailCount = ({ count }: { count: number }): JSX.Element | null => { + if (count !== 0) { + return <>{count} failed; + } + return null; +}; + +const SkippedCount = ({ count }: { count: number }): JSX.Element | null => { + if (count !== 0) { + return <>{count} skipped; + } + return null; +}; + +const FailSkippedWidget = ({ + skipped, + failed, +}: { + skipped: number; + failed: number; +}): JSX.Element | null => { + if (skipped === 0 && failed === 0) { + return null; + } + + if (skipped !== 0 && failed !== 0) { + return ( + <> + {' '} + (, ) + + ); + } + + if (failed !== 0) { + return ( + <> + {' '} + () + + ); + } + + if (skipped !== 0) { + return ( + <> + {' '} + () + + ); + } + + return null; +}; + +export const columnFactories = Object.freeze({ + createTimestampColumn(): TableColumn { + return { + title: 'Timestamp', + defaultSort: 'desc', + hidden: true, + field: 'lastBuild.timestamp', + }; + }, + + createBuildColumn(): TableColumn { + return { + title: 'Build', + field: 'fullName', + highlight: true, + render: (row: Partial) => { + const LinkWrapper = () => { + const routeLink = useRouteRef(buildRouteRef); + if (!row.fullName || !row.lastBuild?.number) { + return ( + <> + {row.fullName || + row.fullDisplayName || + row.displayName || + 'Unknown'} + + ); + } + + return ( + + {row.fullDisplayName} + + ); + }; + + return ; + }, + }; + }, + + createSourceColumn(): TableColumn { + return { + title: 'Source', + field: 'lastBuild.source.branchName', + render: (row: Partial) => ( + <> + + + {row.lastBuild?.source?.branchName} + + + + {row.lastBuild?.source?.commit?.hash} + + + ), + }; + }, + + createStatusColumn(): TableColumn { + return { + title: 'Status', + field: 'status', + render: (row: Partial) => { + return ( + + + + ); + }, + }; + }, + + createTestColumn(): TableColumn { + return { + title: 'Tests', + sorting: false, + render: (row: Partial) => { + return ( + <> + + {row.lastBuild?.tests && ( + + {row.lastBuild?.tests.passed} / {row.lastBuild?.tests.total}{' '} + passed + + + )} + + {!row.lastBuild?.tests && 'n/a'} + + + ); + }, + }; + }, + + createActionsColumn(): TableColumn { + return { + title: 'Actions', + sorting: false, + render: (row: Partial) => { + const ActionWrapper = () => { + const [isLoadingRebuild, setIsLoadingRebuild] = useState(false); + const { allowed, loading } = useEntityPermission( + jenkinsExecutePermission, + ); + + const alertApi = useApi(alertApiRef); + + const onRebuild = async () => { + if (row.onRestartClick) { + setIsLoadingRebuild(true); + try { + await row.onRestartClick(); + alertApi.post({ + message: 'Jenkins re-build has successfully executed', + severity: 'success', + display: 'transient', + }); + } catch (e) { + alertApi.post({ + message: `Jenkins re-build has failed. Error: ${e.message}`, + severity: 'error', + }); + } finally { + setIsLoadingRebuild(false); + } + } + }; + + return ( +
+ {row.lastBuild?.url && ( + + + + + + )} + {isLoadingRebuild && } + {!isLoadingRebuild && ( + + + + + + )} +
+ ); + }; + return ; + }, + width: '10%', + }; + }, +}); diff --git a/plugins/jenkins/src/components/BuildsPage/lib/CITable/index.ts b/plugins/jenkins/src/components/BuildsPage/lib/CITable/index.ts index b5a7ac6337..3be4dae9ce 100644 --- a/plugins/jenkins/src/components/BuildsPage/lib/CITable/index.ts +++ b/plugins/jenkins/src/components/BuildsPage/lib/CITable/index.ts @@ -13,4 +13,4 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { CITable, ciTableColumns } from './CITable'; +export { CITable } from './CITable'; diff --git a/plugins/jenkins/src/components/BuildsPage/lib/CITable/presets.ts b/plugins/jenkins/src/components/BuildsPage/lib/CITable/presets.ts new file mode 100644 index 0000000000..7c0dda9970 --- /dev/null +++ b/plugins/jenkins/src/components/BuildsPage/lib/CITable/presets.ts @@ -0,0 +1,28 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Project } from '../../../../api'; +import { columnFactories } from './columns'; +import { TableColumn } from '@backstage/core-components'; + +export const defaultCITableColumns: TableColumn[] = [ + columnFactories.createTimestampColumn(), + columnFactories.createSourceColumn(), + columnFactories.createBuildColumn(), + columnFactories.createTestColumn(), + columnFactories.createStatusColumn(), + columnFactories.createActionsColumn(), +]; diff --git a/plugins/jenkins/src/index.ts b/plugins/jenkins/src/index.ts index 3a17a879be..7562026bdc 100644 --- a/plugins/jenkins/src/index.ts +++ b/plugins/jenkins/src/index.ts @@ -34,4 +34,3 @@ export { } from './components/Router'; export { JENKINS_ANNOTATION, LEGACY_JENKINS_ANNOTATION } from './constants'; export * from './api'; -export { ciTableColumns } from './components/BuildsPage/lib/CITable';