diff --git a/plugins/scaffolder/src/api.ts b/plugins/scaffolder/src/api.ts index 3c42ed2ca4..cc69ed7627 100644 --- a/plugins/scaffolder/src/api.ts +++ b/plugins/scaffolder/src/api.ts @@ -30,6 +30,8 @@ export class ScaffolderApi { } /** + * Executes the scaffolding of a component, given a template and its + * parameter values. * * @param template Template entity for the scaffolder to use. New project is going to be created out of this template. * @param values Parameters for the template, e.g. name, description @@ -49,7 +51,9 @@ export class ScaffolderApi { }); if (response.status !== 201) { - throw new Error(await response.text()); + const status = `${response.status} ${response.statusText}`; + const body = await response.text(); + throw new Error(`Backend request failed, ${status} ${body.trim()}`); } const { id } = await response.json(); @@ -57,9 +61,8 @@ export class ScaffolderApi { } async getJob(jobId: string) { - const url = `${await this.discoveryApi.getBaseUrl( - 'scaffolder', - )}/v1/job/${encodeURIComponent(jobId)}`; + const baseUrl = await this.discoveryApi.getBaseUrl('scaffolder'); + const url = `${baseUrl}/v1/job/${encodeURIComponent(jobId)}`; return fetch(url).then(x => x.json()); } } diff --git a/plugins/scaffolder/src/components/JobStage/JobStage.tsx b/plugins/scaffolder/src/components/JobStage/JobStage.tsx index 1db2bd528a..c7de6dff61 100644 --- a/plugins/scaffolder/src/components/JobStage/JobStage.tsx +++ b/plugins/scaffolder/src/components/JobStage/JobStage.tsx @@ -19,11 +19,13 @@ import { AccordionDetails, AccordionSummary, Box, + CircularProgress, LinearProgress, Typography, } from '@material-ui/core'; import { makeStyles } from '@material-ui/core/styles'; import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; +import ExpandLessIcon from '@material-ui/icons/ExpandLess'; import cn from 'classnames'; import moment from 'moment'; import React, { Suspense, useEffect, useState } from 'react'; @@ -38,8 +40,7 @@ const useStyles = makeStyles(theme => ({ }, button: { order: -1, - marginRight: 0, - marginLeft: '-20px', + margin: '0 1em 0 -20px', }, cardContent: { backgroundColor: theme.palette.background.default, @@ -110,7 +111,7 @@ export const JobStage = ({ endedAt, startedAt, name, log, status }: Props) => { onChange={(_, newState) => setExpanded(newState)} > } + expandIcon={expanded ? : } aria-controls={`panel-${name}-content`} id={`panel-${name}-header`} IconButtonProps={{ @@ -118,7 +119,8 @@ export const JobStage = ({ endedAt, startedAt, name, log, status }: Props) => { }} > - {name} {timeElapsed && `(${timeElapsed})`} + {name} {timeElapsed && `(${timeElapsed})`}{' '} + {startedAt && !endedAt && } diff --git a/plugins/scaffolder/src/components/JobStatusModal/JobStatusModal.tsx b/plugins/scaffolder/src/components/JobStatusModal/JobStatusModal.tsx index c6ed55c92c..102e93f91d 100644 --- a/plugins/scaffolder/src/components/JobStatusModal/JobStatusModal.tsx +++ b/plugins/scaffolder/src/components/JobStatusModal/JobStatusModal.tsx @@ -51,7 +51,7 @@ export const JobStatusModal = ({ return ( - Creating component... + Creating Component... {!job ? ( diff --git a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx index 3c22e8d50c..1ed0504894 100644 --- a/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx +++ b/plugins/scaffolder/src/components/TemplatePage/TemplatePage.tsx @@ -91,8 +91,12 @@ export const TemplatePage = () => { const handleClose = () => setJobId(null); const handleCreate = async () => { - const job = await scaffolderApi.scaffold(template!, formState); - setJobId(job); + try { + const job = await scaffolderApi.scaffold(template!, formState); + setJobId(job); + } catch (e) { + errorApi.post(e); + } }; const [entity, setEntity] = React.useState( @@ -157,7 +161,7 @@ export const TemplatePage = () => { /> )} {template && ( - +