From c906b03e3beab4be2ef0a289fc24697ce8c5d2ec Mon Sep 17 00:00:00 2001 From: Raghunandan Balachandran Date: Fri, 7 Feb 2020 13:39:38 +0100 Subject: [PATCH 1/5] Initial commit to integrate with scaffolder --- .../plugins/create-entity/package.json | 3 ++- .../CreateEntityFormPage.tsx | 25 +++++++++++++------ .../LoginComponent/LoginComponent.tsx | 2 +- frontend/yarn.lock | 5 ++++ 4 files changed, 26 insertions(+), 9 deletions(-) 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 = () => {
@@ -43,12 +54,12 @@ const CreateEntityFormPage = () => { label="Description:" name="description" id="description" - value={formik.values.description} + onChange={formik.handleChange} variant="outlined" >
-
diff --git a/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx b/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx index f0915bed2e..bc84e8a2f0 100644 --- a/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx +++ b/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx @@ -59,7 +59,7 @@ const LoginComponent: FC = ({ onLogin }) => { Login - {error || 'Just enter any fake username'} + {error || 'Use your github username'} ); }; diff --git a/frontend/yarn.lock b/frontend/yarn.lock index a4961f9b5c..81188e6a16 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -7127,6 +7127,11 @@ form-data@~2.3.2: combined-stream "^1.0.6" mime-types "^2.1.12" +formik-material-ui@2.0.0-alpha.3: + version "2.0.0-alpha.3" + resolved "https://registry.npmjs.org/formik-material-ui/-/formik-material-ui-2.0.0-alpha.3.tgz#1f5e4d98068686fa1c1c0cf54e75b51e92b14981" + integrity sha512-jVG18/cFa89j9omVPQUSJ+4kK7mJ1Wxz0hPVUKwdX+Cr1Z4Vfl1pBo6tJ0xzS2cOj4NEN35D+9Ft1DPAsDa90g== + formik@2.1.4: version "2.1.4" resolved "https://registry.npmjs.org/formik/-/formik-2.1.4.tgz#8deef07ec845ea98f75e03da4aad7aab4ac46570" From e33fcdae78151227bd0e47ed3db9323278b103bf Mon Sep 17 00:00:00 2001 From: Raghunandan Balachandran Date: Fri, 7 Feb 2020 14:07:40 +0100 Subject: [PATCH 2/5] Pass metadata description --- .../components/CreateEntityFormPage/CreateEntityFormPage.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) 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 f93554fc51..ab20425d67 100644 --- a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx +++ b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx @@ -27,7 +27,9 @@ const CreateEntityFormPage = () => { const req = new scaffolderV1.CreateRequest(); req.setComponentId(values.entityId); req.setTemplateId(templateId); - // req.setOrg('soapraj'); + req.setMetadata({ + description: values.description + }); req.setPrivate(false); client.create(req).then((res: scaffolderV1.CreateReply) => { console.log('COMPONENT CREATED'); From 22f588c07e004ee35963809c83a83b28fc1524f8 Mon Sep 17 00:00:00 2001 From: Raghunandan Balachandran Date: Fri, 7 Feb 2020 14:18:19 +0100 Subject: [PATCH 3/5] Use Struct for metadata --- .../CreateEntityFormPage.tsx | 20 ++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) 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 ab20425d67..d596079509 100644 --- a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx +++ b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx @@ -4,6 +4,7 @@ import { useFormik } from 'formik'; import { Button, TextField, makeStyles } from '@material-ui/core'; import { InfoCard } from '@backstage/core'; import { scaffolderV1 } from '@backstage/protobuf-definitions'; +import * as google_protobuf_struct_pb from 'google-protobuf/google/protobuf/struct_pb.js'; const useStyles = makeStyles(theme => ({ formGroup: { @@ -23,19 +24,24 @@ const CreateEntityFormPage = () => { }, onSubmit: (values: any) => { console.log(JSON.stringify(values, null, 2)); + console.log(google_protobuf_struct_pb); const client = new scaffolderV1.Client('http://localhost:8080'); const req = new scaffolderV1.CreateRequest(); req.setComponentId(values.entityId); req.setTemplateId(templateId); - req.setMetadata({ - description: values.description - }); + req.setMetadata( + new google_protobuf_struct_pb.Struct({ + fields: { + description: values.description, + }, + }), + ); req.setPrivate(false); client.create(req).then((res: scaffolderV1.CreateReply) => { console.log('COMPONENT CREATED'); console.log(res.toObject().componentId); }); - } + }, }); return ( @@ -61,7 +67,11 @@ const CreateEntityFormPage = () => { >
-
From 17e60d92e331e6da4ae016cea3bae9855bd09c53 Mon Sep 17 00:00:00 2001 From: Raghunandan Balachandran Date: Fri, 7 Feb 2020 14:32:03 +0100 Subject: [PATCH 4/5] cookiecutter seems to work --- backend/Dockerfile | 3 ++- .../CreateEntityFormPage/CreateEntityFormPage.tsx | 9 +++------ 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/backend/Dockerfile b/backend/Dockerfile index 40b231027d..8cb7508e24 100644 --- a/backend/Dockerfile +++ b/backend/Dockerfile @@ -31,5 +31,6 @@ CMD ["./service"] ### Scaffolder Stage ### needs extra cookiecutter FROM default AS scaffolder -RUN apt-get update && apt-get install -y python-pip +RUN apt-get update && apt-get install -y python-pip +RUN apt-get install -y python-backports.functools-lru-cache RUN pip install cookiecutter==1.7.0 --index-url https://pypi.python.org/simple 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 d596079509..7409cad25c 100644 --- a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx +++ b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx @@ -23,17 +23,14 @@ const CreateEntityFormPage = () => { description: '', }, onSubmit: (values: any) => { - console.log(JSON.stringify(values, null, 2)); - console.log(google_protobuf_struct_pb); const client = new scaffolderV1.Client('http://localhost:8080'); const req = new scaffolderV1.CreateRequest(); req.setComponentId(values.entityId); req.setTemplateId(templateId); + req.setMetadata( - new google_protobuf_struct_pb.Struct({ - fields: { - description: values.description, - }, + new google_protobuf_struct_pb.Struct.fromJavaScript({ + description: values.description, }), ); req.setPrivate(false); From 6f4b7d9c9308256059e271f5f08fec3e3b14739d Mon Sep 17 00:00:00 2001 From: Raghunandan Balachandran Date: Fri, 7 Feb 2020 14:37:28 +0100 Subject: [PATCH 5/5] try require instead of import --- .../components/CreateEntityFormPage/CreateEntityFormPage.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) 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 7409cad25c..7226c82ea7 100644 --- a/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx +++ b/frontend/packages/plugins/create-entity/src/components/CreateEntityFormPage/CreateEntityFormPage.tsx @@ -4,7 +4,8 @@ import { useFormik } from 'formik'; import { Button, TextField, makeStyles } from '@material-ui/core'; import { InfoCard } from '@backstage/core'; import { scaffolderV1 } from '@backstage/protobuf-definitions'; -import * as google_protobuf_struct_pb from 'google-protobuf/google/protobuf/struct_pb.js'; +const google_protobuf_struct_pb = require('google-protobuf/google/protobuf/struct_pb.js'); +// import * as google_protobuf_struct_pb from 'google-protobuf/google/protobuf/struct_pb.js'; const useStyles = makeStyles(theme => ({ formGroup: {