Skip to content

Commit 8c7840a

Browse files
committed
Merge branch 'test_shana_graphql' of https://github.com/khuongdn16/ReacType into router
2 parents 2659dac + b6d6cf7 commit 8c7840a

File tree

11 files changed

+149
-7
lines changed

11 files changed

+149
-7
lines changed

app/electron/main.js

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,10 @@ const {
1616
ipcMain,
1717
} = require('electron');
1818

19+
// ELECTRON WINDOW MANAGER
20+
const windowManager = require('electron-window-manager');
21+
22+
1923
// The splash screen is what appears while the app is loading
2024
const { initSplashScreen, OfficeTemplate } = require('electron-splashscreen');
2125
const { resolve } = require('app-root-path');
@@ -58,8 +62,10 @@ async function createWindow() {
5862
// Create the browser window.
5963
win = new BrowserWindow({
6064
// full screen
61-
width: 1920,
62-
height: 1080,
65+
// width: 1920,
66+
// height: 1080,
67+
width: 1024,
68+
height: 576,
6369
minWidth: 980,
6470
// window title
6571
title: 'ReacType',
@@ -197,6 +203,17 @@ protocol.registerSchemesAsPrivileged([
197203
// Some APIs can only be used after this event occurs.
198204
app.on('ready', createWindow);
199205

206+
// TRYING ELECTRON-WINDOW-MANAGER When the application is ready
207+
208+
// app.on('ready', () => {
209+
// windowManager.setDefaultSetup({'width': 800, 'height': 450, 'position': 'right'});
210+
// // Open Dashboard window
211+
// const dashboard = windowManager.open('home', 'Welcome ...', 'http://localhost:5000/home.html');
212+
// dashboard.toggleDevTools(false);
213+
// // Load ReacType window
214+
// createWindow();
215+
// });
216+
200217
// Quit when all windows are closed.
201218
app.on('window-all-closed', () => {
202219
app.quit();

app/src/Dashboard/Form.jsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
2+
import React from 'react';
3+
4+
5+
const Form = (props) => {
6+
return (<div className = 'form'>
7+
<h3>Form 1 </h3>
8+
<p>Blah</p>
9+
<p>Blah</p>
10+
<p>Blah</p>
11+
12+
</div>);
13+
}
14+
15+
export default Form;

app/src/Dashboard/FormsContainer.jsx

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React, { useContext } from 'react';
2+
import { Link } from "react-router-dom";
3+
4+
import Form from './Form.jsx';
5+
6+
7+
const FormsContainer = () => {
8+
return (
9+
<div>
10+
<Link to="/">
11+
<button type="button">Go Back</button>
12+
</Link>
13+
<Form/>
14+
</div>
15+
);
16+
};
17+
18+
export default FormsContainer;

app/src/Dashboard/home.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Document</title>
8+
</head>
9+
<body>
10+
<h1>Dashboard</h1>
11+
<div id = "root">
12+
</div>
13+
<script type="text/javascript" src="home.js"></script>
14+
</body>
15+
</html>

app/src/Dashboard/home.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// import React from 'react';
2+
import { render } from 'react-dom';
3+
import Form from './Form.jsx';
4+
5+
// uncomment so that webpack can bundle styles
6+
// import styles from './styles.scss';
7+
8+
render(
9+
<div> Some </div>,
10+
document.getElementById('root')
11+
);

app/src/Dashboard/styles.css

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/* @import url('https://fonts.googleapis.com/css2?family=Cabin&family=Oswald&display=swap');
2+
3+
4+
$primary-black: #22292f;
5+
$secondary-black: #606f7b;
6+
$teriary-grey: #f0f0f0;
7+
$light-grey: #bfcbd4;
8+
$light-blue: #759cc9;
9+
$button-blue: #24BCFF; */
10+
11+
.form {
12+
display: flex;
13+
flex-direction: column;
14+
background-color: white;
15+
border: 1px solid #f0f0f0;
16+
box-shadow: 0 0 5px rgba(0,0,0,0.3);
17+
margin: 5px;
18+
border-radius: 5px;
19+
color: #606f7b;
20+
align-items: center;
21+
height: 300px;
22+
justify-content: min;
23+
width: 250px;
24+
}
25+

app/src/components/top/NavBar.tsx

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,14 @@ import createModal from '../right/createModal';
2828
import StateContext from '../../context/context';
2929
import logo from '../../public/icons/win/logo.png';
3030

31+
32+
33+
// ROUTING TO DASHBOARD
34+
import { Link } from "react-router-dom";
35+
36+
37+
38+
3139
// NavBar text and button styling
3240
const useStyles = makeStyles((theme: Theme) =>
3341
createStyles({
@@ -158,6 +166,21 @@ export default function NavBar(props) {
158166
<Typography variant="h6" style={{marginLeft: '1rem'}} className={classes.title}>
159167
ReacType
160168
</Typography>
169+
170+
{/* ==================================Dashboard Button================================================== */}
171+
<Link to='/dashboard'>
172+
<Button
173+
variant="contained"
174+
color="primary"
175+
style={{minWidth: '137.69px'}}
176+
className="navbarButton"
177+
id="navbarButton1"
178+
>
179+
Dashboard
180+
</Button>
181+
</Link>
182+
{/* ==================================Dashboard Button================================================== */}
183+
161184
<Button
162185
variant="contained"
163186
color="primary"

app/src/index.js

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,18 @@ import FBPassWord from './components/login/FBPassWord.tsx';
99
import Tutorial from './tutorial/Tutorial.tsx';
1010
import TutorialPage from './tutorial/TutorialPage.tsx';
1111

12+
/*
13+
* Dashboard
14+
*/
15+
import Dashboard from './Dashboard/FormsContainer.jsx';
16+
import styles from './Dashboard/styles.css';
17+
18+
1219
import {
1320
HashRouter as Router,
1421
Route,
1522
Redirect,
16-
Switch
23+
Switch,
1724
} from 'react-router-dom';
1825

1926
const PrivateRoute = ({ component: Component, ...rest }) => (
@@ -36,6 +43,7 @@ ReactDOM.render(
3643
<Route exact path="/signup" component={SignUp} />
3744
<Route exact path="/password" component={FBPassWord} />
3845
<PrivateRoute exact path="/" component={App} />
46+
<Route exact path="/dashboard" component={Dashboard} />
3947
<Route exact path="/tutorial" component={Tutorial} />
4048
<Route exact path="/tutorialPage/:learn" component={TutorialPage} />
4149
</Switch>

package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,8 @@
4646
"dist-windows": "npm run prod-build && electron-builder --windows",
4747
"dist-all": "npm run prod-build && electron-builder --mac --linux --windows",
4848
"test": "cross-env NODE_ENV=test jest --verbose",
49-
"server": "nodemon server/server.js"
49+
"server": "nodemon server/server.js",
50+
"electron": "cross-env NODE_ENV=development electron ."
5051
},
5152
"repository": {
5253
"type": "git",
@@ -198,7 +199,7 @@
198199
"ts-node": "^8.10.2",
199200
"typescript": "^3.9.6",
200201
"url-loader": "^4.1.0",
201-
"webpack": "^4.42.0",
202+
"webpack": "^4.46.0",
202203
"webpack-cli": "^3.3.11",
203204
"webpack-dev-server": "^3.11.0",
204205
"webpack-merge": "^4.2.2"

server/server.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const express = require('express');
22
const cookieParser = require('cookie-parser');
3+
34
const cors = require('cors');
45
const { Book, TitleOutlined } = require('@material-ui/icons');
56
const userController = require('./controllers/userController');
@@ -71,6 +72,13 @@ const server = new ApolloServer({ typeDefs, resolvers });
7172
server.applyMiddleware({ app });
7273
/** ****************************************************************** */
7374

75+
// const path = require('path');
76+
// // Serve Static Assets
77+
// app.use(express.static(path.resolve(__dirname, './assets')));
78+
/* ******************************************************************* */
79+
80+
81+
7482
app.post(
7583
'/signup',
7684
userController.createUser,

webpack.config.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,7 @@ module.exports = {
66
// since JS can be written for both server / browser, the "target" specifies what environment webpack should write for
77
target: 'web', // Our app can run without electron
88
// The entry is where webpack begins assembling the dependency tree
9-
entry: ['./app/src/index.js'], // The entry point of our app; these entry points can be named and we can also have multiple if we'd like to split the webpack bundle into smaller files to improve script loading speed between multiple pages of our app
10-
// the output is only created on npm run-prod-build
9+
entry: ['./app/src/index.js'],
1110
output: {
1211
path: path.resolve(__dirname, 'app/dist'), // Where all the output files get dropped after webpack is done with them
1312
filename: 'bundle.js' // The name of the webpack bundle that's generated
@@ -78,6 +77,8 @@ module.exports = {
7877
extensions: ['.css']
7978
}
8079
},
80+
81+
8182
// loads common image formats
8283
// resolves import/require on a file into a url and emits the file into the output directory
8384
// url loader converts file into base 64 encoded string that can be passed inline into the file rather than be imported from a seperate file

0 commit comments

Comments
 (0)