diff --git a/internal/ui/src/App.js b/internal/ui/src/App.js
index d23350833..e851baa42 100644
--- a/internal/ui/src/App.js
+++ b/internal/ui/src/App.js
@@ -22,13 +22,7 @@ export default class App extends React.Component {
frontend: 'react',
region: 'us-east-1',
profile: 'default',
- services: [
- {
- name: "test service 1",
- description: "Things.",
- language: "go"
- }
- ]
+ services: []
};
}
@@ -56,9 +50,8 @@ export default class App extends React.Component {
this.setState({ profile: v });
}
- addServices = (s) => {
- let servicesArray = this.state.services.push(s);
- this.setState({ services: servicesArray });
+ setServices = (s) => {
+ this.setState({services: s});
}
generate = () => {
@@ -66,6 +59,7 @@ export default class App extends React.Component {
axios.post('http://localhost:8080/v1/generate', {
"projectName": self.state.projectName,
"frontendFramework": self.state.frontend,
+ "services": self.state.services,
"infrastructure": {
"aws": {
"region": self.state.region,
@@ -99,7 +93,7 @@ export default class App extends React.Component {
setRegion={this.setRegion}
setProfile={this.setProfile} />
-
+
{this.state.success !== null && }
diff --git a/internal/ui/src/Service.js b/internal/ui/src/Service.js
index 01b68f03d..191f23b07 100644
--- a/internal/ui/src/Service.js
+++ b/internal/ui/src/Service.js
@@ -1,23 +1,111 @@
import React from 'react';
import TextField from '@material-ui/core/TextField';
+import List from '@material-ui/core/List';
+import ListItem from '@material-ui/core/ListItem';
+import ListItemText from '@material-ui/core/ListItemText';
+import MenuItem from '@material-ui/core/MenuItem';
+import Menu from '@material-ui/core/Menu';
+import { timeout } from 'q';
+import { timer } from 'rxjs';
-export default function Service() {
- return (
-
+export default class Service extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ name: "",
+ description: "",
+ language: "",
+ anchorEl: null,
+ }
+ }
+
+ updateName = (event) => {
+ this.setState({
+ name: event.target.value
+ }, () => {
+ this.props.update(this.props.serviceID, this.state);
+ })
+ }
+
+ updateDesc = (event) => {
+ this.setState({
+ description: event.target.value
+ }, () => {
+ this.props.update(this.props.serviceID, this.state);
+ })
+ }
+
+ languages = [
+ 'go',
+ 'scala',
+ 'nodejs'
+ ];
+
+ setAnchorEl = element => {
+ this.setState({ anchorEl: element })
+ }
+
+ handleClickListItem = event => {
+ this.setAnchorEl(event.currentTarget);
+ };
+
+ handleMenuItemClick = (event, index) => {
+ this.setAnchorEl(null);
+ this.setState({ language: this.languages[index] }, () => {
+ this.props.update(this.props.serviceID, this.state);
+ });
+ };
+
+ handleClose = () => {
+ this.setAnchorEl(null);
+ };
+
+ render() {
+ return (
+
-
- );
+
+
+
+
+
+
+
+ );
+ }
}
diff --git a/internal/ui/src/Services.js b/internal/ui/src/Services.js
index e119e78fa..52746a6c3 100644
--- a/internal/ui/src/Services.js
+++ b/internal/ui/src/Services.js
@@ -7,14 +7,27 @@ import Service from './Service.js';
export default class Services extends React.Component {
constructor(props) {
super(props);
+ this.state = {
+ services: []
+ }
+ }
+
+ add = () => {
+ this.state.services.push({ name: "", description: ""});
+ this.props.setServices(this.state.services);
+ }
+
+ update = (index, data) => {
+ this.state.services[index] = data;
+ this.props.setServices(this.state.services);
}
render() {
return (
Services
-
- {this.props.services.map((s, i) => )}
+
+ {this.props.services.map((s, i) => )}
);