Skip to content
This repository was archived by the owner on Jul 31, 2020. It is now read-only.

Commit 9f06567

Browse files
orzymandiasBennett Clement
orzymandias
and
Bennett Clement
authored
Resolve merge conflicts (#17)
* fix merge conflict * resolve merge conflict * merge conflicts * Resolve mjs config issues by changing to react-app-rewired Co-authored-by: Bennett Clement <[email protected]>
1 parent 96988c5 commit 9f06567

32 files changed

+22955
-21711
lines changed

‎config-overrides.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
module.exports = function override(webpackConfig) {
2+
webpackConfig.module.rules.push({
3+
test: /\.mjs$/,
4+
include: /node_modules/,
5+
type: "javascript/auto"
6+
});
7+
8+
return webpackConfig;
9+
}

‎package-lock.json

+21,366-21,344
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+5-4
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,9 @@
2121
"axios": "^0.19.2",
2222
"js-slang": "^0.4.11",
2323
"lz-string": "^1.4.4",
24-
"react": "^16.12.0",
24+
"react": "^16.13.1",
2525
"react-ace": "^8.1.0",
26+
"react-app-rewired": "^2.1.5",
2627
"react-dom": "^16.12.0",
2728
"react-router-dom": "^5.1.2",
2829
"react-scripts": "^3.4.0",
@@ -31,9 +32,9 @@
3132
"typescript": "~3.7.2"
3233
},
3334
"scripts": {
34-
"start": "react-scripts start",
35-
"build": "react-scripts build",
36-
"test": "react-scripts test",
35+
"start": "react-app-rewired start",
36+
"build": "react-app-rewired build",
37+
"test": "react-app-rewired test",
3738
"eject": "react-scripts eject"
3839
},
3940
"eslintConfig": {

‎src/App.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from "react";
22
import NavBar from "./NavBar/NavBar2";
3-
import Workspace from "./Workspace";
3+
import Workspace from "./Workspace/WorkspaceCom";
44

55
function App() {
66
return (

‎src/NavBar/BottomBar/BottomBar.css

+40
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
.bottomBar {
2+
position: fixed;
3+
width: 100%;
4+
height: 45px;
5+
box-sizing: border-box;
6+
}
7+
8+
.bottomBar.hide {
9+
transform: translateY(100%);
10+
}
11+
12+
.bottomBar ul {
13+
margin: 0;
14+
padding: 0;
15+
display: flex;
16+
justify-content: center;
17+
float: center;
18+
background: rgba(0, 0, 0, 0.5);
19+
}
20+
21+
.bottomBar ul li {
22+
list-style: none;
23+
line-height: 45px;
24+
text-align: center;
25+
}
26+
27+
.bottomBar ul li a {
28+
display: block;
29+
padding: 0 30px;
30+
text-decoration: none;
31+
color: #fff;
32+
font-weight: bold;
33+
font-size: 16px;
34+
}
35+
36+
.bottomBar ul li a.active,
37+
.bottomBar ul li a:hover {
38+
background: #fd2928;
39+
color: #fff;
40+
}

‎src/NavBar/BottomBar/BottomBar.tsx

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
import React, { useState, useContext } from "react";
2+
import SportsEsportsIcon from "@material-ui/icons/SportsEsports";
3+
import DeveloperModeIcon from "@material-ui/icons/DeveloperMode";
4+
import TextsmsIcon from "@material-ui/icons/Textsms";
5+
6+
import "./BottomBar.css";
7+
8+
interface completeNavBarProps {}
9+
10+
const BottomBar: React.FC<completeNavBarProps> = completeNavBarProps => {
11+
return (
12+
<div>
13+
<div className="buttomBar">
14+
<ul>
15+
<li>
16+
<a href="/playground">
17+
<SportsEsportsIcon
18+
style={{
19+
marginTop: "10px",
20+
fontSize: "30px"
21+
}}
22+
/>
23+
</a>
24+
</li>
25+
<li>
26+
<a href="/playground/repl">
27+
<DeveloperModeIcon
28+
style={{
29+
marginTop: "10px",
30+
fontSize: "30px"
31+
}}
32+
/>
33+
</a>
34+
</li>
35+
<li>
36+
<a href="/playground/description">
37+
<TextsmsIcon
38+
style={{
39+
marginTop: "10px",
40+
fontSize: "30px"
41+
}}
42+
/>
43+
</a>
44+
</li>
45+
</ul>
46+
</div>
47+
</div>
48+
);
49+
};
50+
51+
export default BottomBar;

‎src/NavBar/NavBar.css

+14-2
Original file line numberDiff line numberDiff line change
@@ -16,15 +16,21 @@
1616
width: 250px;
1717
}
1818

19+
.listPlusLogo {
20+
display: inline-flex;
21+
}
1922
.navBar_logo {
2023
width: 50px;
21-
margin-right: 3em;
24+
}
25+
.navBar_navigation-items {
26+
padding-top: 15px;
27+
height: 45px;
2228
}
2329

2430
.navBar_navigation-items ul {
2531
list-style: none;
2632
margin: 0;
27-
padding: 0;
33+
padding-block-end: 0;
2834
display: flex;
2935
}
3036
.navBar_navigation-items li {
@@ -46,6 +52,12 @@
4652
}
4753
}
4854

55+
@media (max-width: 769px) {
56+
.navBar_logo {
57+
padding-top: 8px;
58+
}
59+
}
60+
4961
@media (min-width: 769px) {
5062
.toggleButton {
5163
display: none;

‎src/NavBar/NavBar.tsx

+72-78
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,14 @@ import React, { useContext } from "react";
33
import IconButton from "@material-ui/core/IconButton";
44
import ClearIcon from "@material-ui/icons/Clear";
55
import DehazeIcon from "@material-ui/icons/Dehaze";
6-
import PlayArrowIcon from "@material-ui/icons/PlayArrow";
6+
import DirectionsRunIcon from "@material-ui/icons/DirectionsRun";
77
import { SideBarContext, IAction } from "./SideBarContext";
88
import SourceDropDown from "./SourceDropDown";
9+
import RunButton from "./RunButton";
10+
import PhoneRunButton from "./PhoneRunButton";
11+
912
import "./NavBar.css";
13+
import Grid from "@material-ui/core/Grid";
1014

1115
/**
1216
* States
@@ -23,14 +27,6 @@ let libraryOptions: string[] = [
2327
"MACHINELEARNING",
2428
"All"
2529
];
26-
let languageOptions: string[] = [
27-
"Source",
28-
"C++",
29-
"Java",
30-
"Typescript",
31-
"Javascript",
32-
"Python"
33-
];
3430

3531
const NavBar: React.FC = () => {
3632
const { state, dispatch } = useContext(SideBarContext);
@@ -39,79 +35,77 @@ const NavBar: React.FC = () => {
3935
type: "BUTTON_PRESSED"
4036
});
4137

38+
4239
return (
4340
<div style={{ zIndex: 1 }}>
4441
<header className="navBar">
4542
<nav className="navBar_navigation">
46-
<div className="toggleButton">
47-
<IconButton onClick={toggleButton} edge="start">
48-
<DehazeIcon
49-
style={{
50-
color: "white",
51-
height: "45px",
52-
alignSelf: "flex-start",
53-
display: state.sideDrawerState ? "none" : "flex"
54-
}}
55-
/>
56-
<ClearIcon
57-
style={{
58-
color: "white",
59-
height: "45px",
60-
alignSelf: "flex-start",
61-
display: state.sideDrawerState ? "flex" : "none"
62-
}}
63-
/>
64-
</IconButton>
65-
</div>
66-
<div className="spacer" />
67-
<div>
68-
<img src="images/logo.png" className="navBar_logo" />
69-
</div>
70-
<div className="navBar_navigation-items">
71-
<ul>
72-
<li>
73-
<SourceDropDown
74-
dropDownType="CHANGE_SOURCE"
75-
options={sourceOptions}
76-
sideBarString={"source"}
77-
/>
78-
</li>
79-
{/* <li>
80-
<SourceDropDown
81-
dropDownType="CHANGE_LIBRARY"
82-
options={libraryOptions}
83-
sideBarString={"library"}
84-
/>
85-
</li>
86-
<li>
87-
<SourceDropDown
88-
dropDownType="CHANGE_LANGUAGE"
89-
options={languageOptions}
90-
sideBarString={"language"}
91-
/>
92-
</li> */}
93-
<li>
94-
<a href="/">TextBook</a>
95-
</li>
96-
<li>
97-
<a href="/">Run</a>
98-
</li>
99-
<li>
100-
<a href="/">Share</a>
101-
</li>
102-
</ul>
103-
</div>
104-
<div className="spacer2"></div>
105-
<div className="playButton">
106-
<IconButton>
107-
<PlayArrowIcon
108-
style={{
109-
color: "white",
110-
height: "45px"
111-
}}
112-
/>
113-
</IconButton>
114-
</div>
43+
<Grid container justify="space-between" spacing={2}>
44+
<Grid item>
45+
<div className="toggleButton">
46+
<IconButton onClick={toggleButton} edge="start">
47+
<DehazeIcon
48+
style={{
49+
color: "white",
50+
height: "45px",
51+
display: state.sideDrawerState ? "none" : "flex"
52+
}}
53+
/>
54+
<ClearIcon
55+
style={{
56+
color: "white",
57+
height: "45px",
58+
alignSelf: "flex-start",
59+
display: state.sideDrawerState ? "flex" : "none"
60+
}}
61+
/>
62+
</IconButton>
63+
</div>
64+
</Grid>
65+
<Grid item>
66+
<div className="listPlusLogo">
67+
<div>
68+
<img src="/images/logo.png" className="navBar_logo" />
69+
</div>
70+
71+
<div className="navBar_navigation-items">
72+
<ul>
73+
<li>
74+
<SourceDropDown
75+
dropDownType="CHANGE_SOURCE"
76+
options={sourceOptions}
77+
sideBarString={"source"}
78+
/>
79+
</li>
80+
<li>
81+
<SourceDropDown
82+
dropDownType="CHANGE_LIBRARY"
83+
options={libraryOptions}
84+
sideBarString={"library"}
85+
/>
86+
</li>
87+
<li>
88+
<a href="/">Session</a>
89+
</li>
90+
<li>
91+
<a href="/">Share</a>
92+
</li>
93+
94+
<li>
95+
<a>
96+
<RunButton />
97+
</a>
98+
</li>
99+
</ul>
100+
</div>
101+
</div>
102+
</Grid>
103+
<Grid item>
104+
<div className="playButton">
105+
<PhoneRunButton />
106+
</div>
107+
</Grid>
108+
</Grid>
115109
</nav>
116110
</header>
117111
</div>

‎src/NavBar/PhoneRunButton.tsx

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import React, { useContext } from "react";
2+
import { Store, IGlobalAction } from "./../Store";
3+
import Runner from "./../library_function/Runner";
4+
import IconButton from "@material-ui/core/IconButton";
5+
6+
import DirectionsRunIcon from "@material-ui/icons/DirectionsRun";
7+
8+
import "./NavBar.css";
9+
10+
/**
11+
* States
12+
*/
13+
14+
const RunButton: React.FC = () => {
15+
const { globalState, dispatch } = useContext(Store);
16+
const handleRun = (): IGlobalAction => {
17+
const newComponent: React.ReactElement = (
18+
<Runner code={globalState.playgroundEditorValue} />
19+
);
20+
return dispatch({
21+
type: "RUN",
22+
runComponent: newComponent
23+
});
24+
};
25+
return (
26+
<div>
27+
<IconButton onClick={handleRun}>
28+
<DirectionsRunIcon
29+
style={{
30+
color: "white",
31+
height: "45px"
32+
}}
33+
/>
34+
</IconButton>
35+
</div>
36+
);
37+
};
38+
39+
export default RunButton;

0 commit comments

Comments
 (0)