Skip to content

Commit f2168fd

Browse files
mdtaggmdtagg
authored
Merge pull request #24 from oslabs-beta/stephenfeature
Stephenfeature
2 parents 0cb3058 + 6d430d4 commit f2168fd

10 files changed

Lines changed: 61 additions & 47 deletions

File tree

‎app/context/ApplicationContext.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -44,13 +44,13 @@ const ApplicationContextProvider: React.FC<AppContextProps> = React.memo(props =
4444
console.log({application});
4545
// console.log('Hi, inside ApplicationConext - fetchServicesNames callback. Sending servicesRequest to ipcMain.');
4646
console.log('app when fetch services name: ', application);
47-
console.log(application)
47+
4848
ipcRenderer.send('servicesRequest');
4949
ipcRenderer.on('servicesResponse', (event: Electron.Event, data: any) => {
5050
//data here refers to the data coming the services document of the database
5151
let result: any;
5252
result = JSON.parse(data);
53-
console.log('result from ipcrenderer services response is: ', result);
53+
5454
// console.log('Calling setServicesData passing in above result. Current servicesData is the following: ', servicesData);
5555
setServicesData(result);
5656
ipcRenderer.removeAllListeners('servicesResponse');
@@ -71,7 +71,6 @@ const ApplicationContextProvider: React.FC<AppContextProps> = React.memo(props =
7171
ipcRenderer.removeAllListeners('databaseConnected');
7272
ipcRenderer.send('connect', username, index, URI, databaseType);
7373
ipcRenderer.on('databaseConnected', (event: Electron.Event, data: any) => {
74-
console.log({data});
7574
if(data === true) {
7675
fetchServicesNames(application);
7776
} else {

‎app/modals/AddModal/ServiceDBType.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React from 'react';
22

33

44
const ServiceDBType = (props) => {
5+
const { typeOfService, handleChange, database } = props
56
return (
67
<>
78
<div>
@@ -11,8 +12,8 @@ const ServiceDBType = (props) => {
1112
<select
1213
id="serv-type"
1314
name="typeOfService"
14-
value={props.typeOfService}
15-
onChange={e => props.handleChange(e)}
15+
value={typeOfService}
16+
onChange={e => handleChange(e)}
1617
>
1718
<option value="Docker">Docker</option>
1819
<option value="gRPC">gRPC</option>
@@ -24,7 +25,7 @@ const ServiceDBType = (props) => {
2425
<label htmlFor="db-type">
2526
Type of Database<span>*</span>
2627
</label>
27-
<select id="db-type" name="database" value={props.database} onChange={e => props.handleChange(e)}>
28+
<select id="db-type" name="database" value={database} onChange={e => handleChange(e)}>
2829
<option value="SQL">SQL</option>
2930
<option value="MongoDB">MongoDB</option>
3031
</select>

‎app/modals/AddModal/ServicesDescription.tsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22

33
const ServicesDescription = (props) => {
4+
const { URI, handleChange, name, description } = props;
45
return (
56
<>
67
<div>
@@ -10,8 +11,8 @@ const ServicesDescription = (props) => {
1011
<input
1112
id="db-uri"
1213
name="URI"
13-
value={props.URI}
14-
onChange={e => props.handleChange(e)}
14+
value={URI}
15+
onChange={e => handleChange(e)}
1516
placeholder="Database URI"
1617
required
1718
/>
@@ -24,8 +25,8 @@ const ServicesDescription = (props) => {
2425
id="db-name"
2526
type="text"
2627
name="name"
27-
value={props.name}
28-
onChange={e => props.handleChange(e)}
28+
value={name}
29+
onChange={e => handleChange(e)}
2930
placeholder="Add a name for your new service"
3031
required
3132
/>
@@ -35,8 +36,8 @@ const ServicesDescription = (props) => {
3536
<textarea
3637
id="db-desc"
3738
name="description"
38-
value={props.description}
39-
onChange={e => props.handleChange(e)}
39+
value={description}
40+
onChange={e => handleChange(e)}
4041
placeholder="Add a short description"
4142
/>
4243
</div>

‎app/modals/AwsModal/AwsDescription.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22

33
const AwsDescription = (props) => {
4+
const { name, handleChange, description } = props;
45
return (
56
<>
67
<div>
@@ -11,8 +12,8 @@ const AwsDescription = (props) => {
1112
id="aws-name"
1213
type="text"
1314
name="name"
14-
value={props.name}
15-
onChange={e => props.handleChange(e)}
15+
value={name}
16+
onChange={e => handleChange(e)}
1617
placeholder="Add a name for your new service"
1718
required
1819
/>
@@ -22,8 +23,8 @@ const AwsDescription = (props) => {
2223
<textarea
2324
id="db-desc"
2425
name="description"
25-
value={props.description}
26-
onChange={e => props.handleChange(e)}
26+
value={description}
27+
onChange={e => handleChange(e)}
2728
placeholder="Add a short description"
2829
/>
2930
</div>

‎app/modals/AwsModal/AwsKeyUrl.tsx‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22

33
const AwsKeyUrl = (props) => {
4+
const { typeOfService, accessKey, handleChange, secretAccessKey, awsUrl } = props;
45
return (
56
<>
67
<div>
@@ -10,13 +11,13 @@ const AwsKeyUrl = (props) => {
1011
id="aws-access-key"
1112
type="password"
1213
name="accessKey"
13-
value={props.accessKey}
14-
onChange={e => props.handleChange(e)}
15-
placeholder={props.typeOfService === 'AWS/EKS' ? 'Grafana Bearer Token' : 'AWS Access Key'}
14+
value={accessKey}
15+
onChange={e => handleChange(e)}
16+
placeholder={typeOfService === 'AWS/EKS' ? 'Grafana Bearer Token' : 'AWS Access Key'}
1617
required
1718
/>
1819
</div>
19-
{(props.typeOfService !== 'AWS/EKS') && (
20+
{(typeOfService !== 'AWS/EKS') && (
2021
<div>
2122
<label htmlFor="aws-secret-access-key">
2223
Secret Access Key<span>*</span>
@@ -25,24 +26,24 @@ const AwsKeyUrl = (props) => {
2526
id="aws-secret-access-key"
2627
type="password"
2728
name="secretAccessKey"
28-
value={props.secretAccessKey}
29-
onChange={e => props.handleChange(e)}
29+
value={secretAccessKey}
30+
onChange={e => handleChange(e)}
3031
placeholder="AWS Secret Access Key"
3132
required
3233
/>
3334
</div>
3435
)}
3536
<div>
3637
<label htmlFor="aws-url">
37-
{(props.typeOfService === 'AWS/EKS') ? 'Grafana URL' : 'Access Key'}<span>*</span>
38+
{(typeOfService === 'AWS/EKS') ? 'Grafana URL' : 'Access Key'}<span>*</span>
3839
</label>
3940
<input
4041
id="aws-url"
4142
type="string"
4243
name="awsUrl"
43-
value={props.awsUrl}
44-
onChange={e => props.handleChange(e)}
45-
placeholder={props.typeOfService === 'AWS/EKS'? 'Grafana Provided URL': 'AWS Url'}
44+
value={awsUrl}
45+
onChange={e => handleChange(e)}
46+
placeholder={typeOfService === 'AWS/EKS'? 'Grafana Provided URL': 'AWS Url'}
4647
/>
4748
</div>
4849
</>

‎app/modals/AwsModal/AwsRegion.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22

33
const AwsRegion = (props) => {
4+
const { region, handleChange } = props;
45
return (
56
<div>
67
<label htmlFor="region">
@@ -9,8 +10,8 @@ const AwsRegion = (props) => {
910
<select
1011
id="aws-region"
1112
name="region"
12-
value={props.region}
13-
onChange={e => props.handleChange(e)}
13+
value={region}
14+
onChange={e => handleChange(e)}
1415
placeholder="AWS Region"
1516
required
1617
>

‎app/modals/AwsModal/AwsServiceInstance.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,32 @@
11
import React from 'react';
22

33
const AwsServiceInstance = (props) => {
4+
const { typeOfService, handleChange, instance } = props;
45
return (
56
<>
67
<div>
78
<label htmlFor="serv-type">Type of Service</label>
89
<select
910
id="serv-type"
1011
name="typeOfService"
11-
value={props.typeOfService}
12-
onChange={e => props.handleChange(e)}
12+
value={typeOfService}
13+
onChange={e => handleChange(e)}
1314
>
1415
<option value="AWS/EC2">Elastic Compute Cloud (EC2)</option>
1516
<option value="AWS/ECS">Elastic Container Service (ECS)</option>
1617
<option value="AWS/EKS">Elastic Kubernetes Service (EKS)</option>
1718
</select>
1819
</div>
19-
{props.typeOfService === 'AWS/EC2' && (
20+
{typeOfService === 'AWS/EC2' && (
2021
<div>
2122
<label htmlFor="instance">
2223
AWS Instance ID<span>*</span>
2324
</label>
2425
<input
2526
id="aws-instance"
2627
name="instance"
27-
value={props.instance}
28-
onChange={e => props.handleChange(e)}
28+
value={instance}
29+
onChange={e => handleChange(e)}
2930
placeholder="AWS Instance ID"
3031
required
3132
/>

‎app/modals/ServicesModal/ServicesLink.tsx‎

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -8,34 +8,41 @@ interface IService {
88

99

1010
const ServicesLink = (props) => {
11+
const { services, setServices, servicesData, app} = props;
12+
1113
const toggleService = service => {
12-
if (props.services.includes(service)) {
13-
props.setServices(props.services.filter(el => el !== service));
14+
if (services.includes(service)) {
15+
setServices(services.filter(el => el !== service));
1416
} else {
15-
if (service !== 'communications' && props.services.includes('communications')) props.setServices([]);
16-
props.setServices(props.services.concat(service));
17+
if (service !== 'communications' && services.includes('communications')) setServices([]);
18+
setServices(services.concat(service));
1719
}
1820
};
1921

2022
return (
2123

2224
<div className="services-links">
23-
{props.servicesData.map((service: IService, index: number) => (
25+
{servicesData.map((service: IService, index: number) => (
2426
<div
2527
key={`${index}servicesData`}
26-
className={props.services.includes(service.microservice) ? 'link selected' : 'link'}
28+
className={services.includes(service.microservice) ? 'link selected' : 'link'}
2729
onClick={() => toggleService(service.microservice)}
2830
>
2931
{service.microservice}
3032
</div>
3133
))}
32-
<Link id='selectLink'
33-
className="router link"
34-
to={props.services.length > 0 ? `/applications/${props.app}/${props.services.join(' ')}` : '#'}
34+
<Link
35+
className="selectLink router link"
36+
to={services.length > 0 ? `/applications/${app}/${services.join(' ')}` : '#'}
3537
>
36-
{props.services.length === 0 && 'Select Services'}
37-
{props.services.length === 1 && 'Display Service'}
38-
{props.services.length > 1 && 'Compare Services'}
38+
{services.length === 0 && 'Select Services'}
39+
{services.length === 1 && 'Display Service'}
40+
{services.length > 1 && 'Compare Services'}
41+
</Link>
42+
<Link
43+
className="selectLink router link"
44+
to={`/applications/${app}/client event-bus items inventory orders auth`}>
45+
Select All Services
3946
</Link>
4047
</div>
4148
)

‎app/modals/ServicesModal/ServicesModal.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@
4949
text-align: center;
5050
font-weight: 100;
5151

52-
&#selectLink {
52+
&.selectLink {
5353
background-color: #fbdca3;
5454
}
5555

@@ -83,4 +83,4 @@
8383
font-weight: 100;
8484
color: #444d56;
8585
border-radius: 5px;
86-
}
86+
}

‎app/modals/ServicesModal/ServicesModal.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,8 @@ const ServicesModal: React.FC<ServicesModalProps> = React.memo(({ i, app }) => {
2626
const { user, applications } = useContext(DashboardContext);
2727
const { servicesData, connectToDB } = useContext(ApplicationContext);
2828
const [services, setServices] = useState<Array<string>>([]);
29+
console.log(services);
30+
console.log(services.join(' '));
2931
const [ cardName,dbType,dbURI,description,serviceType ] = applications[i]
3032

3133

0 commit comments

Comments
 (0)