ImagesTable: add azure image link

When an azure image is successfully uploaded the user is provided a link
to view the image in the azure web portal.
This commit is contained in:
Jacob Kozol 2021-05-31 12:30:34 +02:00 committed by Sanne Raymaekers
parent d40a783fc9
commit 3571a7b3c6
3 changed files with 50 additions and 22 deletions

View file

@ -6,24 +6,42 @@ import { ExternalLinkAltIcon } from '@patternfly/react-icons';
const ImageLink = (props) => {
const uploadStatus = props.imageStatus ? props.imageStatus.upload_status : undefined;
if (uploadStatus && uploadStatus.type === 'aws') {
const url = 'https://console.aws.amazon.com/ec2/v2/home?region=' +
uploadStatus.options.region +
'#LaunchInstanceWizard:ami=' +
uploadStatus.options.ami;
return (
<Button
component="a"
target="_blank"
variant="link"
icon={ <ExternalLinkAltIcon /> }
iconPosition="right"
isInline
href={ url }>
Launch instance
</Button>
);
if (uploadStatus) {
if (uploadStatus.type === 'aws') {
const url = 'https://console.aws.amazon.com/ec2/v2/home?region=' +
uploadStatus.options.region +
'#LaunchInstanceWizard:ami=' +
uploadStatus.options.ami;
return (
<Button
component="a"
target="_blank"
variant="link"
icon={ <ExternalLinkAltIcon /> }
iconPosition="right"
isInline
href={ url }>
Launch instance
</Button>
);
} else if (uploadStatus.type === 'azure') {
const url = 'https://portal.azure.com/#@' + props.uploadOptions.tenant_id +
'/resource/subscriptions/' + props.uploadOptions.subscription_id +
'/resourceGroups/' + props.uploadOptions.resource_group +
'/providers/Microsoft.Compute/images/' + uploadStatus.options.image_name;
return (
<Button
component="a"
target="_blank"
variant="link"
icon={ <ExternalLinkAltIcon /> }
iconPosition="right"
isInline
href={ url }>
View uploaded image
</Button>
);
}
}
return null;
@ -31,6 +49,7 @@ const ImageLink = (props) => {
ImageLink.propTypes = {
imageStatus: PropTypes.object,
uploadOptions: PropTypes.object,
};
export default ImageLink;

View file

@ -112,7 +112,9 @@ class ImagesTable extends Component {
{ title: <Release release={ compose.request.distribution } /> },
{ title: <Upload uploadType={ compose.request.image_requests[0].upload_request.type } /> },
{ title: <ImageBuildStatus status={ compose.image_status ? compose.image_status.status : '' } /> },
{ title: <ImageLink imageStatus={ compose.image_status } /> },
{ title: <ImageLink
imageStatus={ compose.image_status }
uploadOptions={ compose.request.image_requests[0].upload_request.options } /> },
]
};
});

View file

@ -231,7 +231,11 @@ const store = {
image_type: 'vhd',
upload_request: {
type: 'azure',
options: {}
options: {
tenant_id: 'test-tenant-id',
subscription_id: 'test-subscription-id',
resource_group: 'test-resource-group'
}
}
}
],
@ -284,8 +288,11 @@ describe('Images Table', () => {
render(<ImageBuildStatus status={ compose.image_status.status } />, { container: testElement });
expect(row.cells[4]).toHaveTextContent(testElement.textContent);
// render the expected <ImageLink /> and compare the text content for an aws link
render(<ImageLink imageStatus={ compose.image_status } />, { container: testElement });
// render the expected <ImageLink /> and compare the text content for a link
render(
<ImageLink imageStatus={ compose.image_status } uploadOptions={ compose.request.image_requests[0].upload_request.options } />,
{ container: testElement }
);
expect(row.cells[5]).toHaveTextContent(testElement.textContent);
}
});