Update action column with both view & replay icons

Signed-off-by: Tim Soslow <tsoslow@shutterstock.com>
This commit is contained in:
Tim Soslow
2023-05-04 17:27:46 -05:00
parent cf95c5137c
commit 17afe1a0bf
8 changed files with 16 additions and 123 deletions
+1 -1
View File
@@ -2,4 +2,4 @@
'@backstage/plugin-jenkins': minor
---
Added configuration for the action column in Jenkins CI/CD table. It can be set to rebuild, view, or replay.
Updated action column in Jenkins CI/CD table to include links to view and replay. The API based rebuild action was replaced because it does not work for Jenkins workflows that have parameters.
-18
View File
@@ -86,24 +86,6 @@ spec:
8. Click the component in the catalog. You should now see Jenkins builds, and a
last build result for your master build.
## Customize Action
You can customize the action in the CI/CD table.
| Action | Description |
| ----------------- | ----------------------- |
| rebuild (default) | Run new build with API |
| view | link to view build page |
| replay | link to start replay |
```yaml
jenkinsPlugin.__experimentalReconfigure({
tableAction: 'view',
});
```
<img src="./src/assets/customize_action_view.png" alt="Customized action - view"/>
## Features
- View all runs inside a folder
+1 -1
View File
@@ -98,7 +98,7 @@ const jenkinsPlugin: BackstagePlugin<
entityContent: RouteRef<undefined>;
},
{},
JenkinsInputPluginOptions
{}
>;
export { jenkinsPlugin };
export { jenkinsPlugin as plugin };
Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 57 KiB

@@ -13,20 +13,17 @@
* 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 { Link, Table, TableColumn } from '@backstage/core-components';
import { useRouteRef } from '@backstage/core-plugin-api';
import { Box, IconButton, 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';
import { useJenkinsPluginOptions } from '../../../../options';
const FailCount = ({ count }: { count: number }): JSX.Element | null => {
if (count !== 0) {
@@ -176,64 +173,16 @@ const generatedColumns: TableColumn[] = [
title: 'Actions',
sorting: false,
render: (row: Partial<Project>) => {
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',
});
} catch (e) {
alertApi.post({
message: `Jenkins re-build has failed. Error: ${e.message}`,
severity: 'error',
});
} finally {
setIsLoadingRebuild(false);
}
}
};
const { tableAction } = useJenkinsPluginOptions();
if (tableAction === 'view') {
return row.lastBuild?.url ? (
<IconButton href={row.lastBuild.url} target="_blank">
<VisibilityIcon />
</IconButton>
) : null;
} else if (tableAction === 'replay') {
return row.lastBuild?.url ? (
<IconButton href={`${row.lastBuild.url}replay`} target="_blank">
<RetryIcon />
</IconButton>
) : null;
}
return (
<Tooltip title="Rerun build">
<>
{isLoadingRebuild && <Progress />}
{!isLoadingRebuild && (
<IconButton onClick={onRebuild} disabled={loading || !allowed}>
<RetryIcon />
</IconButton>
)}
</>
</Tooltip>
);
};
return <ActionWrapper />;
return row.lastBuild?.url ? (
<div style={{ width: '98px' }}>
<IconButton href={row.lastBuild.url} target="_blank">
<VisibilityIcon />
</IconButton>
<IconButton href={`${row.lastBuild.url}replay`} target="_blank">
<RetryIcon />
</IconButton>
</div>
) : null;
},
width: '10%',
},
-29
View File
@@ -1,29 +0,0 @@
/*
* 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 { usePluginOptions } from '@backstage/core-plugin-api/alpha';
export type JenkinsPluginOptions = {
tableAction: string;
};
/** @ignore */
export type JenkinsInputPluginOptions = {
tableAction: string;
};
export const useJenkinsPluginOptions = () =>
usePluginOptions<JenkinsPluginOptions>();
-9
View File
@@ -25,7 +25,6 @@ import {
identityApiRef,
} from '@backstage/core-plugin-api';
import { JenkinsClient, jenkinsApiRef } from './api';
import { JenkinsInputPluginOptions, JenkinsPluginOptions } from './options';
/** @public */
export const rootRouteRef = createRouteRef({
@@ -53,14 +52,6 @@ export const jenkinsPlugin = createPlugin({
routes: {
entityContent: rootRouteRef,
},
__experimentalConfigure(
options?: JenkinsInputPluginOptions,
): JenkinsPluginOptions {
const defaultOptions = {
tableAction: 'rebuild',
};
return { ...defaultOptions, ...options };
},
});
/** @public */