Skip to content

Commit 63b4084

Browse files
Luis-KM-LoLuis-KM-Lo
authored
Merge pull request #49 from oslabs-beta/v4_stage
V4 stage
2 parents dd7cb3a + 36e4d56 commit 63b4084

26 files changed

+365
-131
lines changed

‎src/components/EditorView/EditorView.jsx‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,6 @@ const Editor = () => {
2222
wrappingIndent: 'indent',
2323
automaticLayout: true,
2424
};
25-
// useEffect(() => {
26-
// console.log('in use effect');
27-
// setTimeout(setWasSaved('ghi'), 200000);
28-
// }, [wasSaved]);
2925

3026
const editorDidMount = () => {
3127
editor.setTheme('light-dark');
@@ -46,7 +42,6 @@ const Editor = () => {
4642
if (err) throw err;
4743
});
4844
}
49-
// setTimeout(setWasSaved(''), 50000);
5045
};
5146

5247
let fileType = filePath.split('.')[1];
@@ -59,7 +54,6 @@ const Editor = () => {
5954
return (
6055
<div>
6156
<button id={styles.save} onClick={saveFile}>
62-
{/* onMouseDown={() => setWasSaved('')}> */}
6357
Save Changes
6458
</button>{' '}
6559
<span id={styles.span}>{wasSaved}</span>

‎src/components/EndpointTestComponent/Endpoint.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ const Endpoint = ({ endpoint, index, dispatchToEndpointTestCase }) => {
102102
/>
103103
</div>{' '}
104104
<button
105-
className={styles.addProps}
105+
id={styles.addProps}
106106
style={{ marginTop: '9px' }}
107107
onClick={handleClickAddHeader}
108108
>
@@ -211,7 +211,7 @@ const Endpoint = ({ endpoint, index, dispatchToEndpointTestCase }) => {
211211
<button
212212
// id={id}
213213
onClick={addAssertionHandleClick}
214-
className={styles.assertionButton}
214+
id={styles.assertionButton}
215215
>
216216
<i className='fas fa-plus'></i>
217217
Assertion

‎src/components/EndpointTestComponent/Endpoint.module.scss‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -52,13 +52,11 @@
5252

5353
#groupFlexboxAssertion {
5454
@extend #groupFlexbox;
55+
margin-top: 25px;
5556
#labelInput,
5657
#dropdownWrapper {
5758
margin-right: 10px;
58-
}
59-
#dropdownWrapper {
6059
width: 100%;
61-
6260
#dropdownFlex {
6361
width: 100%;
6462
}
@@ -144,7 +142,7 @@
144142
margin-right: 3em;
145143
}
146144

147-
.addProps {
145+
#addProps {
148146
height: auto;
149147
font-size: 0.85rem;
150148
background-color: rgba(0, 0, 0, 0);
@@ -154,6 +152,9 @@
154152
font-family: $oxygen;
155153
text-align: center;
156154
transition: 150ms;
155+
&:hover {
156+
font-size: 1rem;
157+
}
157158
}
158159

159160
//need to change this
@@ -168,8 +169,8 @@ hr {
168169
align-items: center;
169170
}
170171

171-
.assertionButton {
172-
height: auto;
172+
#assertionButton {
173+
// height: auto;
173174
font-size: 1rem;
174175
background-color: rgba(0, 0, 0, 0);
175176
border: none;
@@ -181,9 +182,8 @@ hr {
181182
color: $mint;
182183

183184
&:hover {
184-
font-size: 1.1rem;
185+
font-size: 1.05rem;
185186
}
186-
187187
i {
188188
margin-right: 0.5rem;
189189
}

‎src/components/EndpointTestComponent/EndpointAssertion.jsx‎

Lines changed: 9 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -5,45 +5,11 @@ import { EndpointTestCaseContext } from '../../context/reducers/endpointTestCase
55
import { deleteAssertion, updateAssertion } from '../../context/actions/endpointTestCaseActions';
66
import { GlobalContext } from '../../context/reducers/globalReducer';
77
import { openBrowserDocs } from '../../context/actions/globalActions';
8+
import jestMatchers from './JestMatchers.js';
89

910
const EndpointAssertion = ({ assertion, index, id }) => {
1011
const [, dispatchToEndpointTestCase] = useContext(EndpointTestCaseContext);
1112
const [, dispatchToGlobal] = useContext(GlobalContext);
12-
const jestMatchers = [
13-
'',
14-
'to Be',
15-
'to Equal (object)',
16-
'to Have Been Called',
17-
'to Have Been Called Times (number)',
18-
'to Have Been Called With (arg1,...)',
19-
'to Have Been Last Called With (arg1,...)',
20-
'to Have Been Nth Called With (nth call, arg1,...)',
21-
'to Have Length (number)',
22-
'to Have Property (keyPath, value[optional])',
23-
'to Be Close To (number, number of digits[optional])',
24-
'to Be Defined',
25-
'to Be Undefined',
26-
'to Be Falsy',
27-
'to Be Truthy',
28-
'to Be NaN',
29-
'to Be Greater Than (number)',
30-
'to Be Greater Than Or Equal (number)',
31-
'to Be Less Than (number)',
32-
'to Be Less Than Or Equal (number)',
33-
'to Be Instance Of (Class)',
34-
'to Contain (item in an array)',
35-
'to Contain Equal (an object in an array)',
36-
'to Match (regexp or string)',
37-
'to Match Object (object)',
38-
'to Srict Equal (object)',
39-
'to Throw (error[optional])',
40-
];
41-
42-
//for mock fuctions only:
43-
// 'to Have Returned',
44-
// 'to Have Returned __ Times (number)',
45-
// 'to Have Last Returned With',
46-
// ];
4713

4814
const questionIcon = require('../../assets/images/help-circle.png');
4915
const closeIcon = require('../../assets/images/close.png');
@@ -80,8 +46,8 @@ const EndpointAssertion = ({ assertion, index, id }) => {
8046
<option value='Headers'></option>
8147
<option value='Status'></option>
8248
<option value='Body'></option>
83-
<option value='Message'></option>
84-
<option value='Length'></option>
49+
<option value='Text'></option>
50+
<option value='Type'></option>
8551
</datalist>
8652
</div>
8753
</div>
@@ -92,7 +58,11 @@ const EndpointAssertion = ({ assertion, index, id }) => {
9258
</div>
9359
<div id={styles.notDiv}>
9460
Not?
95-
<input type='checkbox' onChange={(e) => handleChangeUpdateAssertion(e, 'not')} />
61+
<input
62+
type='checkbox'
63+
onChange={(e) => handleChangeUpdateAssertion(e, 'not')}
64+
style={{ marginLeft: '5px' }}
65+
/>
9666
</div>
9767
</div>
9868
<div id={styles.dropdownFlex}>
@@ -107,16 +77,9 @@ const EndpointAssertion = ({ assertion, index, id }) => {
10777
</select>{' '}
10878
<span id={stylez.hastooltip} role='tooltip'>
10979
<img src={questionIcon} alt='help' onClick={handleClickTooltip} />
110-
<span id={stylez.tooltip}>
111-
{/* <ToolTipMatcher toolTipType={statement.matcherType} /> */}
112-
Click me to find out more about Jest test matchers
113-
</span>
80+
<span id={stylez.tooltip}>Click me to find out more about Jest test matchers</span>
11481
</span>
11582
</div>
116-
{/* <div id={stylez.autoTool}>
117-
<input type='text' /> */}
118-
119-
{/* </div> */}
12083
</div>
12184
<div id={styles.labelInput}>
12285
<label htmlFor='value'>Expected Value</label>

‎src/components/EndpointTestComponent/JestMatchers.js‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
const jestMatchers = [
2+
'',
3+
'to Be',
4+
'to Equal (object)',
5+
'to Have Been Called',
6+
'to Have Been Called Times (number)',
7+
'to Have Been Called With (arg1,...)',
8+
'to Have Been Last Called With (arg1,...)',
9+
'to Have Been Nth Called With (nth call, arg1,...)',
10+
'to Have Length (number)',
11+
'to Have Property (keyPath, value[optional])',
12+
'to Be Close To (number, number of digits[optional])',
13+
'to Be Defined',
14+
'to Be Undefined',
15+
'to Be Falsy',
16+
'to Be Truthy',
17+
'to Be NaN',
18+
'to Be Greater Than (number)',
19+
'to Be Greater Than Or Equal (number)',
20+
'to Be Less Than (number)',
21+
'to Be Less Than Or Equal (number)',
22+
'to Be Instance Of (Class)',
23+
'to Contain (item in an array)',
24+
'to Contain Equal (an object in an array)',
25+
'to Match (regexp or string)',
26+
'to Match Object (object)',
27+
'to Srict Equal (object)',
28+
'to Throw (error[optional])',
29+
];
30+
31+
//for mock fuctions only:
32+
// 'to Have Returned',
33+
// 'to Have Returned __ Times (number)',
34+
// 'to Have Last Returned With',
35+
// ];
36+
37+
export default jestMatchers;

‎src/components/Modals/ExportFileModal.jsx‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const fs = remote.require('fs');
1818
const ExportFileModal = ({ isExportModalOpen, setIsExportModalOpen }) => {
1919
const [fileName, setFileName] = useState('');
2020
const [invalidFileName, setInvalidFileName] = useState(false);
21-
const [{ projectFilePath, file }, dispatchToGlobal] = useContext(GlobalContext);
21+
const [{ projectFilePath, file, validCode }, dispatchToGlobal] = useContext(GlobalContext);
2222

2323
const handleChangeFileName = (e) => {
2424
setFileName(e.target.value);
@@ -126,17 +126,23 @@ const ExportFileModal = ({ isExportModalOpen, setIsExportModalOpen }) => {
126126
<path d='M19,3H16.3H7.7H5A2,2 0 0,0 3,5V7.7V16.4V19A2,2 0 0,0 5,21H7.7H16.4H19A2,2 0 0,0 21,19V16.3V7.7V5A2,2 0 0,0 19,3M15.6,17L12,13.4L8.4,17L7,15.6L10.6,12L7,8.4L8.4,7L12,10.6L15.6,7L17,8.4L13.4,12L17,15.6L15.6,17Z' />
127127
</svg>
128128
</div>
129-
<div id={styles.body}>
130-
<p>File Name</p>
131-
<input type='text' value={fileName} onChange={handleChangeFileName} />
132-
{invalidFileName && <p>A file with the name '{fileName}' already exists.</p>}
133-
<button id={styles.save} onClick={closeExportModal}>
134-
Cancel
135-
</button>
136-
<button id={styles.save} onClick={handleClickSave}>
137-
Save
138-
</button>
139-
</div>
129+
{validCode ? (
130+
<div id={styles.body}>
131+
<p>File Name</p>
132+
<input type='text' value={fileName} onChange={handleChangeFileName} />
133+
{invalidFileName && <p>A file with the name '{fileName}' already exists.</p>}
134+
<button id={styles.save} onClick={closeExportModal}>
135+
Cancel
136+
</button>
137+
<button id={styles.save} onClick={handleClickSave}>
138+
Save
139+
</button>
140+
</div>
141+
) : (
142+
<div id={styles.body}>
143+
<p>Please fill out all required fields before exporting your test file</p>
144+
</div>
145+
)}
140146
</ReactModal>
141147
</div>
142148
);

‎src/components/Modals/ExportFileModal.module.scss‎

Lines changed: 32 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,16 @@
33

44
.modal {
55
position: fixed;
6-
top: 35%;
7-
left: 30%;
86
width: 500px;
9-
height: 200px;
107
font-family: $openSans;
118
background-color: $mint;
129
border: 8px solid $mint;
1310
border-radius: 5px;
1411
box-shadow: 0 0 0 1px white inset;
12+
object-fit: cover;
13+
top: 50%;
14+
left: 50%;
15+
transform: translate(-50%, -50%);
1516
}
1617

1718
#title {
@@ -38,17 +39,40 @@
3839
}
3940

4041
#body {
41-
padding: 20px 25px;
42+
padding: 20px 25px 10px 25px;
43+
44+
#endpoint {
45+
color: black;
46+
span {
47+
margin-left: 50px;
48+
}
49+
50+
span:hover {
51+
color: $mint;
52+
}
53+
54+
li {
55+
margin-left: 50px;
56+
}
57+
li:last-child {
58+
margin-bottom: 5px;
59+
}
60+
li:first-child {
61+
margin-top: 4px;
62+
}
63+
}
64+
4265
p {
4366
color: #fff;
4467
font-size: 14px;
68+
line-height: 1.5;
4569
}
4670
input {
4771
margin: 10px 0;
4872
width: 430px;
4973
}
5074
button {
51-
margin: 10px 5px;
75+
margin: 10px 5px 5px 5px;
5276
font-size: 12px;
5377
text-align: center;
5478
vertical-align: middle;
@@ -113,20 +137,21 @@
113137
}
114138

115139
pre {
116-
padding: 12px;
140+
padding: 12px 15px;
117141
margin-top: -4px;
118142
margin-bottom: 8px;
119143
overflow: auto;
120144
font-size: 85%;
121145
line-height: 1.45;
122146
background-color: #f6f8fa;
123-
border-radius: 6px;
147+
// border-radius: 6px;
124148
.code-wrapper {
125149
background: #f4f4f4;
126150
// padding: 1rem;
127151
border: 1px solid #ddd;
128152
color: #666;
129153
width: 500px;
154+
130155
code {
131156
display: inline;
132157
max-width: auto;

0 commit comments

Comments
 (0)