Skip to content

Commit 2c7595f

Browse files
ChristianEdwardPadillaChristianEdwardPadilla
committed
merge conflicts resolved
2 parents aacd66c + 48143e6 commit 2c7595f

File tree

7 files changed

+121
-133
lines changed

7 files changed

+121
-133
lines changed

‎main.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ function exportComponents() {
4444
ipcMain.on('choose_app_dir', (event) => {
4545
const directory = dialog.showOpenDialog(mainWindow, {
4646
properties: ['openDirectory'],
47+
buttonLabel: 'Export',
4748
});
4849

4950
if (!directory) return;

‎src/components/ApplicationActions.jsx renamed to ‎src/components/MainContainerHeader.jsx

Lines changed: 38 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,53 @@
1-
import React from "react";
1+
import React from 'react';
22
// import PropTypes from 'prop-types';
3-
import Button from "@material-ui/core/Button";
4-
import ZoomInIcon from "@material-ui/icons/ZoomIn";
5-
import ZoomOutIcon from "@material-ui/icons/ZoomOut";
6-
import ImageSearchIcon from "@material-ui/icons/ImageSearch";
7-
import OpenWithIcon from "@material-ui/icons/OpenWith";
8-
import KeyboardArrowLeftIcon from "@material-ui/icons/KeyboardArrowLeft";
9-
import KeyboardArrowRightIcon from "@material-ui/icons/KeyboardArrowRight";
10-
import DeleteOutlineIcon from "@material-ui/icons/DeleteOutline";
11-
import GetAppIcon from "@material-ui/icons/GetApp";
12-
import { withStyles } from "@material-ui/core/styles";
13-
import Tooltip from "@material-ui/core/Tooltip";
3+
import Button from '@material-ui/core/Button';
4+
import ZoomInIcon from '@material-ui/icons/ZoomIn';
5+
import ZoomOutIcon from '@material-ui/icons/ZoomOut';
6+
import ImageSearchIcon from '@material-ui/icons/ImageSearch';
7+
import OpenWithIcon from '@material-ui/icons/OpenWith';
8+
import KeyboardArrowLeftIcon from '@material-ui/icons/KeyboardArrowLeft';
9+
import KeyboardArrowRightIcon from '@material-ui/icons/KeyboardArrowRight';
10+
import DeleteOutlineIcon from '@material-ui/icons/DeleteOutline';
11+
import GetAppIcon from '@material-ui/icons/GetApp';
12+
import { withStyles } from '@material-ui/core/styles';
13+
import Tooltip from '@material-ui/core/Tooltip';
1414

1515
const styles = () => ({
1616
iconSmall: {
17-
fontSize: 10
17+
fontSize: 10,
1818
},
1919
button: {
2020
// borderRight: '1px solid grey',
21-
borderRadius: "0px",
22-
backgroundColor: "#212121",
21+
borderRadius: '0px',
22+
backgroundColor: '#212121',
2323

24-
"&:hover > span > svg": {
25-
color: "#1de9b6",
26-
transition: "all .2s ease"
24+
'&:hover > span > svg': {
25+
color: '#1de9b6',
26+
transition: 'all .2s ease',
2727
},
28-
"&:hover": {
29-
backgroundColor: "#212121"
28+
'&:hover': {
29+
backgroundColor: '#212121',
3030
},
31-
"&:disabled": {
32-
backgroundColor: "#424242"
31+
'&:disabled': {
32+
backgroundColor: '#424242',
3333
},
3434

35-
"&:disabled > span > svg": {
36-
color: "#eee",
37-
opacity: "0.3"
38-
}
35+
'&:disabled > span > svg': {
36+
color: '#eee',
37+
opacity: '0.3',
38+
},
3939
},
4040
light: {
41-
color: "#eee"
41+
color: '#eee',
4242
// opacity: '0.7',
4343
},
4444
dark: {
45-
color: "#1de9b6"
46-
}
45+
color: '#1de9b6',
46+
},
4747
});
4848

49-
const MainContainerHeader = props => {
49+
50+
const MainContainerHeader = (props) => {
5051
const {
5152
classes,
5253
image,
@@ -55,13 +56,13 @@ const MainContainerHeader = props => {
5556
totalComponents,
5657
showGenerateAppModal,
5758
collapseColumn,
58-
rightColumnOpen
59+
rightColumnOpen,
5960
} = props;
6061

6162
return (
6263
<div className="main-header">
6364
<div className="main-header-buttons">
64-
<Tooltip title="remove image">
65+
{/* <Tooltip title="remove image">
6566
<div>
6667
<Button
6768
disabled={!image}
@@ -73,18 +74,14 @@ const MainContainerHeader = props => {
7374
</Button>
7475
</div>
7576
</Tooltip>
76-
<Tooltip title={image ? "update image" : "upload image"}>
77+
<Tooltip title={image ? 'update image' : 'upload image'}>
7778
<div>
78-
<Button
79-
color="default"
80-
className={classes.button}
81-
onClick={updateImage}
82-
>
79+
<Button color="default" className={classes.button} onClick={updateImage}>
8380
<ImageSearchIcon className={classes.light} />
8481
</Button>
8582
</div>
86-
</Tooltip>
87-
<Tooltip title={"export"}>
83+
</Tooltip> */}
84+
<Tooltip title={'export'}>
8885
<div>
8986
<Button
9087
color="default"
@@ -115,4 +112,4 @@ const MainContainerHeader = props => {
115112
// toggleClass: PropTypes.bool.isRequired,
116113
// };
117114

118-
export default withStyles(styles)(MainContainerHeader);
115+
export default withStyles(styles)(MainContainerHeader);

‎src/components/theme.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { createMuiTheme } from '@material-ui/core/styles';
22
// import teal from '@material-ui/core/colors/teal';
33
import indigo from '@material-ui/core/colors/indigo';
4+
import { Palette } from '@material-ui/core/styles/createPalette';
45

56
interface palette {
67
primary: object;

‎src/containers/LeftContainer.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import Grid from "@material-ui/core/Grid";
1010
import { withStyles } from "@material-ui/core/styles";
1111
import LeftColExpansionPanel from "../components/LeftColExpansionPanel.jsx";
1212
import HTMLComponentPanel from "../components/HTMLComponentPanel.jsx";
13-
import ApplicationActions from "../components/ApplicationActions.jsx";
13+
// import ApplicationActions from "../components/ApplicationActions.jsx";
1414

1515
// import createModal from '../utils/createModal.util';
1616
import * as actions from "../actions/components";
@@ -150,10 +150,10 @@ class LeftContainer extends Component {
150150
focusComponent={focusComponent}
151151
addChild={addChild}
152152
/>
153-
<ApplicationActions
154-
// showImageDeleteModal={showImageDeleteModal}
155-
// showGenerateAppModal={showGenerateAppModal}
156-
/>
153+
{/* <ApplicationActions
154+
showImageDeleteModal={showImageDeleteModal}
155+
showGenerateAppModal={showGenerateAppModal}
156+
/> */}
157157
{/* </div> */}
158158
</div>
159159
);

‎src/containers/MainContainer.jsx

Lines changed: 6 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import {
1818
changeImagePath,
1919
} from '../actions/components';
2020
import KonvaStage from '../components/KonvaStage.jsx';
21-
// import MainContainerHeader from "../components/ApplicationActions.jsx/index.js";
21+
import MainContainerHeader from '../components/MainContainerHeader.jsx';
2222
import createModal from '../utils/createModal.util';
2323

2424
const IPC = require('electron').ipcRenderer;
@@ -226,11 +226,7 @@ class MainContainer extends Component {
226226
key={i}
227227
button
228228
onClick={() => chooseGenOptions(i)}
229-
style={{
230-
border: '1px solid #3f51b5',
231-
marginBottom: '2%',
232-
marginTop: '5%',
233-
}}
229+
style={{ border: '1px solid #3f51b5', marginBottom: '2%', marginTop: '5%' }}
234230
>
235231
<ListItemText primary={option} style={{ textAlign: 'center' }} />
236232
</ListItem>
@@ -277,10 +273,10 @@ class MainContainer extends Component {
277273
<MuiThemeProvider theme={theme}>
278274
<div className="main-container" style={{ cursor }}>
279275
{modal}
280-
{/* <MainContainerHeader
276+
<MainContainerHeader
281277
showImageDeleteModal={showImageDeleteModal}
282278
showGenerateAppModal={showGenerateAppModal}
283-
/> */}
279+
/>
284280

285281
<div className="main" ref={main}>
286282
<KonvaStage
@@ -298,14 +294,8 @@ class MainContainer extends Component {
298294
/>
299295
</div>
300296

301-
{/* <div
302-
className="button-wrapper"
303-
style={{ background: "rgba(76, 175, 80, 0)" }}
304-
>
305-
<Button
306-
onClick={deleteChild}
307-
style={{ width: "150px", display: "inline-block" }}
308-
>
297+
{/* <div className="button-wrapper" style={{ background: 'rgba(76, 175, 80, 0)' }}>
298+
<Button onClick={deleteChild} style={{ width: '150px', display: 'inline-block' }}>
309299
delete child
310300
</Button>
311301

‎src/utils/componentRender.util.js

Lines changed: 32 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,23 @@
11
const componentRender = (component, data) => {
22
const {
3-
stateful, children, title, props,
3+
stateful, id, position, childrenArray, title, props,
44
} = component;
55

6+
// need to filter with reduce the import, copy from below
67
if (stateful) {
78
return `
89
import React, { Component } from 'react';
9-
import PropTypes from 'prop-types';
10-
${children.map(child => `import ${child.title} from './${child.title}.tsx'`).join('\n')}
11-
10+
${childrenArray
11+
.map(child => `import ${child.componentName} from './${child.componentName}.tsx'`)
12+
.reduce((acc, child) => {
13+
if (!acc.includes(child)) {
14+
acc.push(child);
15+
return acc;
16+
}
17+
return acc;
18+
}, [])
19+
.join('\n')}
20+
1221
class ${title} extends Component {
1322
constructor(props) {
1423
super(props);
@@ -18,51 +27,40 @@ const componentRender = (component, data) => {
1827
const { ${props.map(p => `${p.key}`).join(', ')} } = this.props;
1928
return (
2029
<div>
21-
${children
22-
.map(
23-
child => `<${child.title} ${child.props
24-
.map(prop => `${prop.key}={${prop.value}}`)
25-
.join(' ')}/>`,
26-
)
27-
.join('\n')}
30+
${childrenArray.map(child => `<${child.componentName}/>`).join('\n')}
2831
</div>
2932
)
3033
}
3134
}
3235
33-
${title}.propTypes = {
34-
${props
35-
.map(p => `${p.key}: PropTypes.${p.type}${p.required ? '.isRequired' : ''},`)
36-
.join('\n')}
37-
}
38-
3936
export default ${title};
4037
`;
4138
}
4239

4340
return `
4441
import React from 'react';
45-
import PropTypes from 'prop-types';
46-
${children.map(child => `import ${child.title} from './${child.title}.tsx'`).join('\n')}
47-
48-
const ${title} = props => (
49-
<div>
50-
${children
51-
.map(
52-
child => `<${child.title} ${child.props
53-
.map(prop => `${prop.key}={${prop.value}}`)
54-
.join(' ')}/>`,
55-
)
42+
${childrenArray
43+
.map(child => `import ${child.componentName} from './${child.componentName}.tsx'`)
44+
.reduce((acc, child) => {
45+
if (!acc.includes(child)) {
46+
acc.push(child);
47+
return acc;
48+
}
49+
return acc;
50+
}, [])
5651
.join('\n')}
57-
</div>
58-
);
52+
5953
60-
${title}.propTypes = {
61-
${props
62-
.map(p => `${p.key}: PropTypes.${p.type}${p.required ? '.isRequired' : ''},`)
63-
.join('\n')}
54+
type Props = {
55+
${component.props.map(prop => `${prop.key}: ${prop.type}`).join('\n')}
6456
}
6557
58+
const ${title} = (props: Props) => (
59+
<div>
60+
${childrenArray.map(child => `<${child.componentName}/>`).join('\n')}
61+
</div>
62+
);
63+
6664
export default ${title};
6765
`;
6866
};

0 commit comments

Comments
 (0)