Skip to content

Commit 637c1b8

Browse files
dev-plamdev-plam
authored
Merge pull request #2 from oslabs-beta/frontend
prettier stuff
2 parents 5b4f39f + e8c499f commit 637c1b8

File tree

106 files changed

+14249
-12319
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

106 files changed

+14249
-12319
lines changed

‎.prettierrc

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"printWidth": 100,
3+
"semi": true,
4+
"singleQuote": true,
5+
"jsxSingleQuote": true,
6+
"tabWidth": 2,
7+
"bracketSpacing": true,
8+
"trailingComma": "none"
9+
}

‎demo-app/src/client/Components/Board.tsx

Lines changed: 17 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ class Board extends Component<{}, BoardState> {
1818
currentPlayer: 'X',
1919
gameOver: false,
2020
message: '',
21-
scoreboard: { X: 0, O: 0 },
21+
scoreboard: { X: 0, O: 0 }
2222
};
2323

2424
this.resetBoard = this.resetBoard.bind(this);
@@ -38,7 +38,7 @@ class Board extends Component<{}, BoardState> {
3838
return [
3939
['-', '-', '-'],
4040
['-', '-', '-'],
41-
['-', '-', '-'],
41+
['-', '-', '-']
4242
];
4343
}
4444

@@ -51,7 +51,7 @@ class Board extends Component<{}, BoardState> {
5151
this.setState({
5252
gameOver: false,
5353
board: this.newBoard(),
54-
message: '',
54+
message: ''
5555
});
5656
}
5757

@@ -73,44 +73,28 @@ class Board extends Component<{}, BoardState> {
7373
if (!gameOver) {
7474
// win conditions: matching rows, columns, or diagonals, that are not empty('-')
7575
if (
76-
(board[0][0] === board[0][1] &&
77-
board[0][1] === board[0][2] &&
78-
board[0][2] !== '-') ||
79-
(board[1][0] === board[1][1] &&
80-
board[1][1] === board[1][2] &&
81-
board[1][2] !== '-') ||
82-
(board[2][0] === board[2][1] &&
83-
board[2][1] === board[2][2] &&
84-
board[2][2] !== '-') ||
85-
(board[0][0] === board[1][0] &&
86-
board[1][0] === board[2][0] &&
87-
board[2][0] !== '-') ||
88-
(board[0][1] === board[1][1] &&
89-
board[1][1] === board[2][1] &&
90-
board[2][1] !== '-') ||
91-
(board[0][2] === board[1][2] &&
92-
board[1][2] === board[2][2] &&
93-
board[2][2] !== '-') ||
94-
(board[0][0] === board[1][1] &&
95-
board[1][1] === board[2][2] &&
96-
board[2][2] !== '-') ||
97-
(board[2][0] === board[1][1] &&
98-
board[1][1] === board[0][2] &&
99-
board[0][2] !== '-')
76+
(board[0][0] === board[0][1] && board[0][1] === board[0][2] && board[0][2] !== '-') ||
77+
(board[1][0] === board[1][1] && board[1][1] === board[1][2] && board[1][2] !== '-') ||
78+
(board[2][0] === board[2][1] && board[2][1] === board[2][2] && board[2][2] !== '-') ||
79+
(board[0][0] === board[1][0] && board[1][0] === board[2][0] && board[2][0] !== '-') ||
80+
(board[0][1] === board[1][1] && board[1][1] === board[2][1] && board[2][1] !== '-') ||
81+
(board[0][2] === board[1][2] && board[1][2] === board[2][2] && board[2][2] !== '-') ||
82+
(board[0][0] === board[1][1] && board[1][1] === board[2][2] && board[2][2] !== '-') ||
83+
(board[2][0] === board[1][1] && board[1][1] === board[0][2] && board[0][2] !== '-')
10084
) {
10185
// winner is the person who's turn was previous
10286
const winner: Player = currentPlayer === 'X' ? 'O' : 'X';
10387

10488
this.setState({
10589
gameOver: true,
106-
message: `Player ${winner} wins!`,
90+
message: `Player ${winner} wins!`
10791
});
10892

10993
// draw condition: no '-' remaining in board without above win condition triggering
11094
} else if (!spacesLeft()) {
11195
this.setState({
11296
gameOver: true,
113-
message: 'Draw!',
97+
message: 'Draw!'
11498
});
11599
}
116100
}
@@ -120,7 +104,7 @@ class Board extends Component<{}, BoardState> {
120104
const boardCopy: BoardContent = [
121105
[...this.state.board[0]],
122106
[...this.state.board[1]],
123-
[...this.state.board[2]],
107+
[...this.state.board[2]]
124108
];
125109
boardCopy[row][column] = this.state.currentPlayer;
126110
const newPlayer: Player = this.state.currentPlayer === 'X' ? 'O' : 'X';
@@ -131,22 +115,17 @@ class Board extends Component<{}, BoardState> {
131115
const rows: Array<JSX.Element> = [];
132116
for (let i = 0; i < 3; i++) {
133117
rows.push(
134-
<Row
135-
key={i}
136-
row={i}
137-
handleBoxClick={this.handleBoxClick}
138-
values={this.state.board[i]}
139-
/>
118+
<Row key={i} row={i} handleBoxClick={this.handleBoxClick} values={this.state.board[i]} />
140119
);
141120
}
142121
const { X, O }: Scoreboard = this.state.scoreboard;
143122

144123
return (
145-
<div className="board">
124+
<div className='board'>
146125
<h1>Tic Tac Toe</h1>
147126
{this.state.gameOver && <h4>{this.state.message}</h4>}
148127
{rows}
149-
<button id="reset" onClick={this.resetBoard}>
128+
<button id='reset' onClick={this.resetBoard}>
150129
Reset
151130
</button>
152131
</div>

‎demo-app/src/client/Components/Box.tsx

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,7 @@ type BoxProps = {
1010

1111
const Box = (props: BoxProps) => {
1212
return (
13-
<button
14-
className="box"
15-
onClick={(e) => props.handleBoxClick(props.row, props.column)}
16-
>
13+
<button className='box' onClick={(e) => props.handleBoxClick(props.row, props.column)}>
1714
{props.value}
1815
</button>
1916
);

‎demo-app/src/client/Components/Buttons.tsx

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,22 @@
1-
import React from "react";
2-
import Increment from "./Increment";
1+
import React from 'react';
2+
import Increment from './Increment';
33

44
function Buttons() {
55
const buttons = [];
6-
for (let i = 0; i < 4; i++){
7-
buttons.push(<Increment />)
6+
for (let i = 0; i < 4; i++) {
7+
buttons.push(<Increment />);
88
}
99

10-
return(
11-
<div className="buttons">
10+
return (
11+
<div className='buttons'>
1212
<h1>Stateful Buttons</h1>
13-
<h4>These buttons are functional components that each manage their own state with the useState hook.</h4>
13+
<h4>
14+
These buttons are functional components that each manage their own state with the useState
15+
hook.
16+
</h4>
1417
{buttons}
1518
</div>
16-
)
19+
);
1720
}
1821

19-
export default Buttons;
22+
export default Buttons;

‎demo-app/src/client/Components/Home.tsx

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,21 @@ import React from 'react';
22

33
function Home() {
44
return (
5-
<div className="about">
5+
<div className='about'>
66
<h1>Lorem Ipsum</h1>
77
<p>
8-
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
9-
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
10-
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
11-
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
12-
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
13-
occaecat cupidatat non proident, sunt in culpa qui officia deserunt
14-
mollit anim id est laborum."
8+
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
9+
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
10+
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
11+
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
12+
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
1513
</p>
1614
<p>
17-
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
18-
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
19-
veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
20-
commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
21-
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
22-
occaecat cupidatat non proident, sunt in culpa qui officia deserunt
23-
mollit anim id est laborum."
15+
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
16+
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
17+
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
18+
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
19+
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
2420
</p>
2521
</div>
2622
);

‎demo-app/src/client/Components/Increment.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ function Increment() {
44
const [count, setCount] = useState(0);
55

66
return (
7-
<button className="increment" onClick={() => setCount(count + 1)}>
7+
<button className='increment' onClick={() => setCount(count + 1)}>
88
You clicked me {count} times.
99
</button>
1010
);

‎demo-app/src/client/Components/Nav.tsx

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,20 @@
1-
import React from "react";
2-
import { Link } from "react-router-dom";
1+
import React from 'react';
2+
import { Link } from 'react-router-dom';
33

44
function Nav() {
5-
return(
6-
<div className="nav">
7-
<Link className="link" to="/">About</Link>
8-
<Link id="tictactoe" className="link" to="/tictactoe">Tic-Tac-Toe</Link>
9-
<Link className="link" to="/buttons">Counter</Link>
5+
return (
6+
<div className='nav'>
7+
<Link className='link' to='/'>
8+
About
9+
</Link>
10+
<Link id='tictactoe' className='link' to='/tictactoe'>
11+
Tic-Tac-Toe
12+
</Link>
13+
<Link className='link' to='/buttons'>
14+
Counter
15+
</Link>
1016
</div>
11-
)
17+
);
1218
}
1319

14-
export default Nav;
20+
export default Nav;

‎demo-app/src/client/Components/Row.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ const Row = (props: RowProps) => {
2222
);
2323
}
2424

25-
return <div className="row">{boxes}</div>;
25+
return <div className='row'>{boxes}</div>;
2626
};
2727

2828
export default Row;

‎demo-app/src/client/Router.tsx

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,21 @@
1-
import * as React from "react";
2-
import * as ReactDOM from "react-dom";
3-
import { BrowserRouter, Routes, Route } from "react-router-dom";
4-
import Nav from "./Components/Nav";
5-
import Board from "./Components/Board";
6-
import Home from "./Components/Home";
7-
import Buttons from "./Components/Buttons";
1+
import * as React from 'react';
2+
import * as ReactDOM from 'react-dom';
3+
import { BrowserRouter, Routes, Route } from 'react-router-dom';
4+
import Nav from './Components/Nav';
5+
import Board from './Components/Board';
6+
import Home from './Components/Home';
7+
import Buttons from './Components/Buttons';
88

9-
const root = document.getElementById("root");
9+
const root = document.getElementById('root');
1010

1111
ReactDOM.render(
12-
<BrowserRouter>
13-
<Nav />
14-
<Routes>
15-
<Route path="/tictactoe" element={<Board />}/>
16-
<Route path="/" element={<Home />}/>
17-
<Route path="/buttons" element={<Buttons />}/>
18-
</Routes>
19-
</BrowserRouter>, root);
12+
<BrowserRouter>
13+
<Nav />
14+
<Routes>
15+
<Route path='/tictactoe' element={<Board />} />
16+
<Route path='/' element={<Home />} />
17+
<Route path='/buttons' element={<Buttons />} />
18+
</Routes>
19+
</BrowserRouter>,
20+
root
21+
);

‎demo-app/src/types.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
export type Scoreboard = {
2-
X: number,
3-
O: number
4-
}
2+
X: number;
3+
O: number;
4+
};
55

66
export type Player = 'X' | 'O';
77

0 commit comments

Comments
 (0)