diff --git a/frontend/packages/plugins/create-entity/package.json b/frontend/packages/plugins/create-entity/package.json index 4855921c54..bfac679ec1 100644 --- a/frontend/packages/plugins/create-entity/package.json +++ b/frontend/packages/plugins/create-entity/package.json @@ -18,7 +18,8 @@ "react-dom": "^16.12.0", "@material-ui/core": "^4.9.1", "@material-ui/icons": "^4.9.1", - "formik": "2.1.4" + "formik": "2.1.4", + "formik-material-ui": "2.0.0-alpha.3" }, "scripts": { "lint": "web-scripts lint", diff --git a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx index 6482aff6bf..f93554fc51 100644 --- a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx +++ b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx @@ -3,6 +3,7 @@ import { useRouteMatch } from 'react-router-dom'; import { useFormik } from 'formik'; import { Button, TextField, makeStyles } from '@material-ui/core'; import { InfoCard } from '@backstage/core'; +import { scaffolderV1 } from '@backstage/protobuf-definitions'; const useStyles = makeStyles(theme => ({ formGroup: { @@ -21,8 +22,18 @@ const CreateEntityFormPage = () => { description: '', }, onSubmit: (values: any) => { - alert(JSON.stringify(values, null, 2)); - }, + console.log(JSON.stringify(values, null, 2)); + const client = new scaffolderV1.Client('http://localhost:8080'); + const req = new scaffolderV1.CreateRequest(); + req.setComponentId(values.entityId); + req.setTemplateId(templateId); + // req.setOrg('soapraj'); + req.setPrivate(false); + client.create(req).then((res: scaffolderV1.CreateReply) => { + console.log('COMPONENT CREATED'); + console.log(res.toObject().componentId); + }); + } }); return ( @@ -32,9 +43,9 @@ const CreateEntityFormPage = () => {