Began integrating dashboard.
Also fixed match controller populate calls.
This commit is contained in:
parent
e4db4ab403
commit
8a7fbd074b
@ -8,6 +8,8 @@ import { Container, Nav, NavbarBrand } from "react-bootstrap";
|
||||
import NavbarToggle from "react-bootstrap/esm/NavbarToggle";
|
||||
import NavbarCollapse from "react-bootstrap/esm/NavbarCollapse";
|
||||
import Dashboard from "./pages/Dashboard";
|
||||
import Login from "./pages/Login";
|
||||
|
||||
export default class Layout extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
@ -29,8 +31,9 @@ export default class Layout extends React.Component {
|
||||
</header>
|
||||
<main>
|
||||
<Routes>
|
||||
<Route path="/" element={<Welcome></Welcome>} />
|
||||
<Route path="/Dashboard" element={<Dashboard></Dashboard>} />
|
||||
<Route path="/" element={<Welcome />} />
|
||||
<Route path="/dashboard" element={<Dashboard />} />
|
||||
<Route path="/login" element={<Login />} />
|
||||
</Routes>
|
||||
</main>
|
||||
<footer>
|
||||
|
@ -1,21 +1,23 @@
|
||||
import React from "react";
|
||||
import { Button, InputGroup, FormControl } from "react-bootstrap";
|
||||
import "../styles/Dashboard.css";
|
||||
import { apiClient } from "../utils/httpClients";
|
||||
import { apiClient } from "../utils/httpClients.js";
|
||||
import MatchInfoCardDisplay from "../components/MatchInfoCardDisplay";
|
||||
export default class Dashboard extends React.Component{
|
||||
import { needUser } from "../utils/routing.js";
|
||||
export default class Dashboard extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
displayedMatches: [],
|
||||
displayedSports: [],
|
||||
displayedEquipment: []
|
||||
displayedEquipment: [],
|
||||
user: null
|
||||
};
|
||||
this.getFirstName();
|
||||
}
|
||||
async componentDidMount() {
|
||||
await this.latestMatches();
|
||||
|
||||
this.setState({ user: await needUser() }); // needUser says this page needs a user, and therefore, if there isn't a user, get them to login first. It returns the authenticated user.
|
||||
this.setState({ displayedMatches: await this.latestMatches() });
|
||||
}
|
||||
async latestMatches() {
|
||||
let recentMatchesRes = await apiClient.get("/match/recent/15");
|
||||
@ -38,14 +40,14 @@ export default class Dashboard extends React.Component{
|
||||
}
|
||||
}
|
||||
|
||||
async getFirstName(){
|
||||
async getFirstName() {
|
||||
// let result = await apiClient.post("/user/login", {"email": "johndoe@gmail.com", "password": "csc309h1"}).then(apiClient.get("/user"));
|
||||
let user = await apiClient.get("/user");
|
||||
let tags = document.getElementsByTagName("h1");
|
||||
tags[0].innerHTML = user.firstName;
|
||||
}
|
||||
render() {
|
||||
return(
|
||||
return (
|
||||
<React.Fragment>
|
||||
<h1></h1>
|
||||
<InputGroup className="w-50">
|
||||
@ -55,7 +57,7 @@ export default class Dashboard extends React.Component{
|
||||
aria-describedby="basic-addon2"
|
||||
/>
|
||||
<Button variant="outline-secondary" id="button-addon2">
|
||||
Search
|
||||
Search
|
||||
</Button>
|
||||
</InputGroup>
|
||||
<div className="p-4">
|
||||
|
@ -15,25 +15,27 @@ export default class Login extends React.Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Card>
|
||||
<Card.Body>
|
||||
<Card.Title>Login</Card.Title>
|
||||
<Card.Subtitle>Welcome back!</Card.Subtitle>
|
||||
<Form>
|
||||
<Form.Group className="mb-3" controlId="loginEmail">
|
||||
<Form.Label>E-mail</Form.Label>
|
||||
<Form.Control type="email" placeholder="Ex. youremail@mail.com" />
|
||||
</Form.Group>
|
||||
<Form.Group className="mb-3" controlId="loginPassword">
|
||||
<Form.Label>Password</Form.Label>
|
||||
<Form.Control type="password" placeholder="Enter password" />
|
||||
</Form.Group>
|
||||
<Button variant="primary" type="submit">
|
||||
Login
|
||||
</Button>
|
||||
</Form>
|
||||
</Card.Body>
|
||||
</Card>
|
||||
<div className="page-root">
|
||||
<Card>
|
||||
<Card.Body>
|
||||
<Card.Title>Login</Card.Title>
|
||||
<Card.Subtitle>Welcome back!</Card.Subtitle>
|
||||
<Form>
|
||||
<Form.Group className="mb-3" controlId="loginEmail">
|
||||
<Form.Label>E-mail</Form.Label>
|
||||
<Form.Control type="email" placeholder="Ex. youremail@mail.com" />
|
||||
</Form.Group>
|
||||
<Form.Group className="mb-3" controlId="loginPassword">
|
||||
<Form.Label>Password</Form.Label>
|
||||
<Form.Control type="password" placeholder="Enter password" />
|
||||
</Form.Group>
|
||||
<Button variant="primary" type="submit">
|
||||
Login
|
||||
</Button>
|
||||
</Form>
|
||||
</Card.Body>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
@ -1,3 +1,3 @@
|
||||
#!/bin/bash
|
||||
|
||||
mongod --dbpath ./server/mongo-data
|
||||
mongod --dbpath ../server/mongo-data
|
@ -48,12 +48,12 @@ MatchController.get("/recent/:limit?", needDatabase, async (req, res) => {
|
||||
}
|
||||
let recent = null;
|
||||
if (user) {
|
||||
await user.populate("participatingMatches");
|
||||
await user.populate("participatingMatches").populate("participatingMatches.members.$");
|
||||
recent = user.participatingMatches.slice(-limit);
|
||||
} else {
|
||||
recent = await matchModel.find().where("publicity").gte(2).limit(limit).sort({ createDate: -1 });
|
||||
recent = await matchModel.find().where("publicity").gte(2).limit(limit).sort({ createDate: -1 }).populate("members.$");
|
||||
}
|
||||
await recent.populate("members.$"); // Populates all references.
|
||||
await recent; // Populates all references.
|
||||
res.status(200).send({ recent: recent });
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
|
Loading…
Reference in New Issue
Block a user