Skip to content

Commit 15e59bf

Browse files
ChristianEdwardPadillaChristianEdwardPadilla
committed
Merge pull request #62 from ChristianEdwardPadilla/development
cleanup
2 parents 65a9db8 + 529cbda commit 15e59bf

12 files changed

+295
-464
lines changed

‎src/actions/components.js

Lines changed: 21 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -77,14 +77,11 @@ export const deleteChild = ({}) => dispatch => {
7777
};
7878

7979
export const deleteComponent = ({ componentId, stateComponents }) => dispatch => {
80-
console.log('Hello from component.js delete component.componentId= ', componentId);
81-
8280
// find all places where the "to be delted" is a child and do what u gotta do
8381
stateComponents.forEach(parent => {
8482
parent.childrenArray
8583
.filter(child => child.childComponentId == componentId)
8684
.forEach(child => {
87-
// console.log(`Should delete ${child.childId} from component id:${parent.id} ${parent.title}`)
8885
dispatch({
8986
type: DELETE_CHILD,
9087
payload: {
@@ -149,13 +146,13 @@ export const changeComponentFocusChild = ({ componentId, childId }) => dispatch
149146
});
150147
};
151148

152-
export const exportFiles = ({ components, path }) => dispatch => {
149+
export const exportFiles = ({ components, path, appName, exportAppBool }) => dispatch => {
153150
// this dispatch sets the global state property 'loading' to true until the createFiles call resolves below
154151
dispatch({
155152
type: EXPORT_FILES,
156153
});
157154

158-
createFiles(components, path)
155+
createFiles(components, path, appName, exportAppBool)
159156
.then(dir =>
160157
dispatch({
161158
type: EXPORT_FILES_SUCCESS,
@@ -192,10 +189,18 @@ export const createApplication = ({
192189
components = [],
193190
genOption,
194191
appName = 'reactype_app',
195-
repoUrl,
192+
exportAppBool,
196193
}) => dispatch => {
197194
if (genOption === 0) {
198-
dispatch(exportFiles({ path, components }));
195+
exportAppBool = false;
196+
dispatch(
197+
exportFiles({
198+
appName,
199+
path,
200+
components,
201+
exportAppBool,
202+
}),
203+
);
199204
} else if (genOption) {
200205
dispatch({
201206
type: CREATE_APPLICATION,
@@ -204,13 +209,20 @@ export const createApplication = ({
204209
path,
205210
appName,
206211
genOption,
207-
repoUrl,
212+
exportAppBool,
208213
})
209214
.then(() => {
210215
dispatch({
211216
type: CREATE_APPLICATION_SUCCESS,
212217
});
213-
dispatch(exportFiles({ path: `${path}/${appName}`, components }));
218+
dispatch(
219+
exportFiles({
220+
appName,
221+
path,
222+
components,
223+
exportAppBool,
224+
}),
225+
);
214226
})
215227
.catch(err =>
216228
dispatch({

‎src/components/BottomPanel.jsx

Lines changed: 12 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,23 @@
1-
import React, { Component } from "react";
2-
import { connect } from "react-redux";
3-
import {
4-
handleClose,
5-
deleteCompProp,
6-
addCompProp
7-
} from "../actions/components";
8-
import RightTabs from "./RightTabs.jsx";
9-
import { some } from "bluebird-lst";
1+
import React, { Component } from 'react';
2+
import { connect } from 'react-redux';
3+
import { some } from 'bluebird-lst';
4+
import { handleClose, deleteCompProp, addCompProp } from '../actions/components';
5+
import RightTabs from './RightTabs.jsx';
106

11-
const IPC = require("electron").ipcRenderer;
7+
const IPC = require('electron').ipcRenderer;
128

139
const mapDispatchToProps = dispatch => ({
1410
handleNotificationClose: () => dispatch(handleClose()),
1511
deleteProp: ({ id, index }) => dispatch(deleteCompProp({ id, index })),
16-
addProp: prop => dispatch(addCompProp(prop))
12+
addProp: prop => dispatch(addCompProp(prop)),
1713
});
1814

1915
const mapStateToProps = store => ({
2016
// successOpen: store.workspace.successOpen,
2117
// errorOpen: store.workspace.errorOpen,
2218
// appDir: store.workspace.appDir,
2319
focusChild: store.workspace.focusChild,
24-
components: store.workspace.components
20+
components: store.workspace.components,
2521
});
2622

2723
class BottomPanel extends Component {
@@ -31,7 +27,7 @@ class BottomPanel extends Component {
3127
// };
3228

3329
viewAppDir = () => {
34-
IPC.send("view_app_dir", this.props.appDir);
30+
IPC.send('view_app_dir', this.props.appDir);
3531
};
3632

3733
render() {
@@ -44,14 +40,12 @@ class BottomPanel extends Component {
4440
focusComponent,
4541
deleteProp,
4642
addProp,
47-
focusChild
43+
focusChild,
4844
// rightColumnOpen
4945
} = this.props;
5046

51-
console.log(components);
52-
5347
return (
54-
<div className="bottom-panel" style={{ width: "100%" }}>
48+
<div className="bottom-panel" style={{ width: '100%' }}>
5549
<RightTabs
5650
components={components}
5751
focusComponent={focusComponent}
@@ -74,5 +68,5 @@ class BottomPanel extends Component {
7468

7569
export default connect(
7670
mapStateToProps,
77-
mapDispatchToProps
71+
mapDispatchToProps,
7872
)(BottomPanel);

‎src/components/HtmlAttr.jsx

Lines changed: 88 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -1,82 +1,78 @@
1-
import React, { Component, Fragment } from "react";
2-
import { connect } from "react-redux";
3-
import { withStyles } from "@material-ui/core/styles";
4-
import Grid from "@material-ui/core/Grid";
5-
import TextField from "@material-ui/core/TextField";
6-
import IconButton from "@material-ui/core/IconButton";
7-
import { updateHtmlAttr } from "../actions/components";
8-
import UpdateIcon from "@material-ui/icons/Update";
9-
import { HTMLelements, getSize } from "../utils/htmlElements.util";
1+
import React, { Component, Fragment } from 'react';
2+
import { connect } from 'react-redux';
3+
import { withStyles } from '@material-ui/core/styles';
4+
import Grid from '@material-ui/core/Grid';
5+
import TextField from '@material-ui/core/TextField';
6+
import IconButton from '@material-ui/core/IconButton';
7+
import UpdateIcon from '@material-ui/icons/Update';
8+
import { updateHtmlAttr } from '../actions/components';
9+
import { HTMLelements, getSize } from '../utils/htmlElements.util';
1010

1111
const styles = theme => ({
1212
root: {
13-
display: "flex",
14-
justifyContent: "center",
15-
flexWrap: "wrap"
13+
display: 'flex',
14+
justifyContent: 'center',
15+
flexWrap: 'wrap',
1616
},
1717
chip: {
1818
margin: theme.spacing.unit,
19-
color: "#eee",
20-
backgroundColor: "#333333"
19+
color: '#eee',
20+
backgroundColor: '#333333',
2121
},
2222
column: {
23-
display: "inline-flex",
24-
alignItems: "baseline"
23+
display: 'inline-flex',
24+
alignItems: 'baseline',
2525
},
2626
icon: {
27-
fontSize: "20px",
28-
color: "#eee",
29-
opacity: "0.7",
30-
transition: "all .2s ease",
27+
fontSize: '20px',
28+
color: '#eee',
29+
opacity: '0.7',
30+
transition: 'all .2s ease',
3131

32-
"&:hover": {
33-
color: "red"
34-
}
32+
'&:hover': {
33+
color: 'red',
34+
},
3535
},
3636
cssLabel: {
37-
color: "white",
37+
color: 'white',
3838

39-
"&$cssFocused": {
40-
color: "green"
41-
}
39+
'&$cssFocused': {
40+
color: 'green',
41+
},
4242
},
4343
cssFocused: {},
4444
input: {
45-
color: "#fff",
46-
opacity: "0.7",
47-
marginBottom: "10px"
45+
color: '#fff',
46+
opacity: '0.7',
47+
marginBottom: '10px',
4848
},
4949
light: {
50-
color: "#eee"
50+
color: '#eee',
5151
},
5252
avatar: {
53-
color: "#eee",
54-
fontSize: "10px"
55-
}
53+
color: '#eee',
54+
fontSize: '10px',
55+
},
5656
});
5757

5858
const mapDispatchToProps = dispatch => ({
59-
updateHtmlAttr: ({ attr, value }) => dispatch(updateHtmlAttr({ attr, value }))
59+
updateHtmlAttr: ({ attr, value }) => dispatch(updateHtmlAttr({ attr, value })),
6060
});
6161

6262
const mapStateToProps = store => ({
6363
focusComponent: store.workspace.focusComponent,
64-
focusChild: store.workspace.focusChild
64+
focusChild: store.workspace.focusChild,
6565
});
6666

6767
class HtmlAttr extends Component {
68-
state = HTMLelements[this.props.focusChild.htmlElement].attributes.reduce(
69-
(acc, attr) => {
70-
acc[attr] = "";
71-
return acc;
72-
},
73-
{}
74-
);
68+
state = HTMLelements[this.props.focusChild.htmlElement].attributes.reduce((acc, attr) => {
69+
acc[attr] = '';
70+
return acc;
71+
}, {});
7572

76-
handleChange = event => {
77-
console.log(event.target.id, event.target.value);
73+
handleChange = (event) => {
7874
this.setState({
79-
[event.target.id]: event.target.value.trim()
75+
[event.target.id]: event.target.value.trim(),
8076
});
8177
};
8278

@@ -88,77 +84,63 @@ class HtmlAttr extends Component {
8884

8985
render() {
9086
const {
91-
focusComponent,
92-
classes,
93-
deleteProp,
94-
addProp,
95-
focusChild,
96-
updateHtmlAttr
87+
focusComponent, classes, deleteProp, addProp, focusChild, updateHtmlAttr,
9788
} = this.props;
9889

9990
const focusChildType = focusChild.htmlElement;
10091

10192
console.log(focusChild);
10293

103-
const HtmlForm = HTMLelements[focusChildType].attributes.map((attr, i) => {
104-
return (
105-
<Grid
106-
container
107-
spacing={8}
108-
alignItems="baseline"
109-
align="stretch"
110-
key={i}
111-
>
112-
<Grid item xs={6}>
113-
<TextField
114-
id={attr}
115-
label={attr}
116-
margin="normal"
117-
autoFocus
118-
// style={(marginLeft = "20px")}
119-
onChange={this.handleChange}
120-
value={this.state[attr]}
121-
InputProps={{
122-
className: classes.input
123-
}}
124-
InputLabelProps={{
125-
className: classes.input
126-
}}
127-
/>
128-
<IconButton
129-
aria-label="Update"
130-
onClick={() => {
131-
updateHtmlAttr({ attr, value: this.state[attr] });
132-
}}
133-
// onClick={() => {
134-
// addChild({ title, childType: "COMP" });
135-
// }}
136-
>
137-
<UpdateIcon />
138-
</IconButton>
139-
</Grid>
140-
<Grid item xs={6}>
141-
<TextField
142-
disabled
143-
id="filled-disabled"
144-
label={attr}
145-
defaultValue={focusChild.HTMLInfo[attr]}
146-
style={{ background: "bcbcbc" }}
147-
className={classes.textField}
148-
margin="normal"
149-
variant="filled"
150-
/>
151-
</Grid>
94+
const HtmlForm = HTMLelements[focusChildType].attributes.map((attr, i) => (
95+
<Grid container spacing={8} alignItems="baseline" align="stretch" key={i}>
96+
<Grid item xs={6}>
97+
<TextField
98+
id={attr}
99+
label={attr}
100+
margin="normal"
101+
autoFocus
102+
// style={(marginLeft = "20px")}
103+
onChange={this.handleChange}
104+
value={this.state[attr]}
105+
InputProps={{
106+
className: classes.input,
107+
}}
108+
InputLabelProps={{
109+
className: classes.input,
110+
}}
111+
/>
112+
<IconButton
113+
aria-label="Update"
114+
onClick={() => {
115+
updateHtmlAttr({ attr, value: this.state[attr] });
116+
}}
117+
// onClick={() => {
118+
// addChild({ title, childType: "COMP" });
119+
// }}
120+
>
121+
<UpdateIcon />
122+
</IconButton>
152123
</Grid>
153-
);
154-
});
155-
// console.log(HtmlForm);
124+
<Grid item xs={6}>
125+
<TextField
126+
disabled
127+
id="filled-disabled"
128+
label={attr}
129+
defaultValue={focusChild.HTMLInfo[attr]}
130+
style={{ background: 'bcbcbc' }}
131+
className={classes.textField}
132+
margin="normal"
133+
variant="filled"
134+
/>
135+
</Grid>
136+
</Grid>
137+
));
156138

157-
return <div className={"htmlattr"}>{HtmlForm}</div>;
139+
return <div className={'htmlattr'}>{HtmlForm}</div>;
158140
}
159141
}
160142

161143
export default connect(
162144
mapStateToProps,
163-
mapDispatchToProps
145+
mapDispatchToProps,
164146
)(withStyles(styles)(HtmlAttr));

0 commit comments

Comments
 (0)