Compare commits

...

119 Commits

Author SHA1 Message Date
8e1ead37e6 Allowing proxying for secure cookies. 2022-04-09 18:46:18 -05:00
450fcfeb5a Server start command fixed.
Environment variable encapsulated within quotes.
2022-04-09 15:56:31 -05:00
f65fbd70aa Fixed unset mongodb uri environment variable. 2022-04-08 13:26:31 -05:00
Arjun Sahni
1c704cb606
Merge pull request #10 from csc309-winter-2022/develop
Develop
2022-04-07 23:01:46 -04:00
Arjun Sahni
eee941ffcc
Merge pull request #9 from csc309-winter-2022/rentals
Rentals
2022-04-07 22:21:43 -04:00
Sahni-Arjun
0d5e9351ab merge 2022-04-07 22:21:05 -04:00
Sahni-Arjun
a01b9a0f48 added rentals page 2022-04-07 22:16:48 -04:00
88c0de660e Start of profile page. 2022-04-07 20:59:30 -05:00
5948ed561c Removed extra pardon button for matches. 2022-04-07 20:51:32 -05:00
753669c0af If the user session has expired, update context appropriately. 2022-04-07 20:47:12 -05:00
90040f9049 Admin display connected to backend. 2022-04-07 20:43:31 -05:00
9c4696b797 Fixed date issue with models. 2022-04-07 20:23:32 -05:00
5d2528da5f Fixed database check. 2022-04-07 19:22:35 -05:00
a0a347e0c2 Authentication guard will now always refresh user identity. 2022-04-07 18:00:14 -05:00
e7d689cdde Finished sign up page. 2022-04-07 17:59:55 -05:00
f9fef07b9a Made change to api call to reflect server-side changes. 2022-04-07 17:59:12 -05:00
eb4e4b2444 Added suspension mechanism. 2022-04-07 17:57:08 -05:00
2e8ba9c5b1 Separated public recent matches and user recent matches endpoints. 2022-04-07 17:36:57 -05:00
92289c87b3 Auth. guard now only renders child if authenticated. 2022-04-07 15:37:45 -05:00
525c2b6d5a Authentication guard now takes in a access level prop. 2022-04-07 13:51:38 -05:00
0e218750f8 Removed unecessary async declaration. 2022-04-07 13:38:29 -05:00
fa8552d488 Fixed login route and authentication guards. 2022-04-07 13:36:49 -05:00
ef66904c60 Merge branch 'develop' of https://github.com/csc309-winter-2022/team58 into develop 2022-04-06 22:54:22 -05:00
b575fc7fde Login endpoint now returns the user profile. 2022-04-06 22:53:20 -05:00
Arjun Sahni
da3dc6fdad
Merge pull request #8 from csc309-winter-2022/admin_page
Admin page
2022-04-06 23:00:08 -04:00
Sahni-Arjun
26abdd6aa5 comment 2022-04-06 22:57:53 -04:00
f98b003808 Implemented component version of authentication guard. 2022-04-06 21:18:48 -05:00
Sahni-Arjun
468f1cfa31 Merge branch 'develop' into admin_page 2022-04-06 22:15:09 -04:00
6856cd3b71 Eslint no longer complains about linebreaks. 2022-04-06 21:14:40 -05:00
Sahni-Arjun
7c8e37aea8 finished admin frontend 2022-04-06 22:09:03 -04:00
c738e8044a eslint no fails compiles due to unused imports. 2022-04-06 21:03:30 -05:00
499cbf3409 Fixed api client url error. 2022-04-06 20:35:41 -05:00
Sahni-Arjun
54b01f81c5 Admin page 2022-04-06 19:34:21 -04:00
Arjun Sahni
24f085e17a
Update README.md 2022-04-05 21:59:20 -04:00
fdbd372430 Merge branch 'main' of https://github.com/csc309-winter-2022/team58 2022-04-05 20:54:46 -05:00
30894c59c4 Merge branch 'develop' of https://github.com/csc309-winter-2022/team58 into develop 2022-04-05 20:54:29 -05:00
34bbfb3d5d Final changes. 2022-04-05 20:54:26 -05:00
Hansi Xu
9f1df7f7f4 Merge branch 'restructure' into develop 2022-04-05 21:48:51 -04:00
Hansi Xu
f6a8cebbec Merge branch 'signup-page' into restructure 2022-04-05 21:48:32 -04:00
Hansi Xu
5a49a1e4f8 Moved signup to pages 2022-04-05 21:48:08 -04:00
Piyush Sharma
096eadce13
Update README.md 2022-04-05 21:45:01 -04:00
Hansi Xu
1fd60e39d4 Merge branch 'restructure' into develop 2022-04-05 21:40:49 -04:00
Hansi Xu
332e4e94d8 Merge branch 'signup-page' into restructure 2022-04-05 21:40:21 -04:00
Hansi Xu
d86570996e updating the signup page 2022-04-05 21:39:48 -04:00
Hansi Xu
c691b710b7 Merge branch 'restructure' into develop 2022-04-05 21:18:15 -04:00
Hansi Xu
6c79a4e9b3 Merge branch 'signup-page' into restructure 2022-04-05 21:16:49 -04:00
Hansi Xu
559973de5a Create signup.js 2022-04-05 21:15:39 -04:00
6cd421ba01 Fixed sport display. 2022-04-05 20:13:55 -05:00
0a2d513d3c Merge branch 'main' of https://github.com/csc309-winter-2022/team58 2022-04-05 20:04:49 -05:00
bb911173ec Merge branch 'develop' 2022-04-05 20:03:30 -05:00
911e5a2c79 Merge branch 'Dashboard' into restructure 2022-04-05 20:00:28 -05:00
999f884694 Login now displays an error message on a failed login. 2022-04-05 19:51:13 -05:00
Piyush Sharma
8f46ad77b8 Added cards and scroll styling 2022-04-05 20:17:50 -04:00
c4c4031e4c Login complete. 2022-04-05 19:14:11 -05:00
5c393cb73d Changed layout to a be a function component. 2022-04-05 18:47:06 -05:00
Sahni-Arjun
94d3369d4e admin page 2022-04-05 19:29:44 -04:00
4aced5ed2d Added "api/" prefix to api routes.
Client updated to reflect changes.
2022-04-05 17:24:41 -05:00
b2c4178482 Fixed broken recent matches endpoint. 2022-04-05 16:19:05 -05:00
8a7fbd074b Began integrating dashboard.
Also fixed match controller populate calls.
2022-04-05 14:52:19 -05:00
e4db4ab403 Merge branch 'restructure' into login-page 2022-04-05 14:22:28 -05:00
67c1b9e821 Added route guards and login page template. 2022-04-05 14:20:50 -05:00
Piyush Sharma
fe3039b4f3
Merge pull request #7 from csc309-winter-2022/Dashboard
Dashboard
2022-04-05 15:19:46 -04:00
Piyush Sharma
d5a11d214c Updated Dashboard 2022-04-05 14:51:15 -04:00
Piyush Sharma
2877fc3fd7 Merge remote-tracking branch 'origin/restructure' into Dashboard 2022-04-05 13:19:19 -04:00
Piyush Sharma
879cbac17f Added Dashboard 2022-04-05 13:16:09 -04:00
0b42dde699 Added mongo starts scripts. 2022-04-05 12:11:06 -05:00
b447dcd985 Fixed broken import. 2022-04-05 12:00:55 -05:00
98ea02b56c Added rental controller to server routes. 2022-04-05 11:54:06 -05:00
8f96a2e5c9 Multiple changes, basic rental CRUD backend implemented.
All responses are now in their own object with context name.

Added limit to user based recent results for matches.

Moved all code in endpoints inside try and catch.

Renamed authentication guard function.
2022-04-05 11:50:35 -05:00
a7885ecf53 Added padding to horizontal scrollers. 2022-04-05 03:44:04 -05:00
6cedd74473 Recent match endpoint now populates all references. 2022-04-05 03:41:20 -05:00
d17fe1d912 Fixed extra comma on stringified items. 2022-04-05 03:30:59 -05:00
c1589b9758 Welcome page now shows current matches. 2022-04-05 03:28:12 -05:00
Sahni-Arjun
859147ea3d comment 2022-04-05 03:50:11 -04:00
Piyush Sharma
2831e2a39e Added route 2022-04-05 02:19:17 -04:00
Piyush Sharma
f38867598e Setup Dashboard Page 2022-04-05 02:19:08 -04:00
f8abf7cd48 Changed carousel images to be more fitting. 2022-04-05 01:06:54 -05:00
8464c4debc Changed carousel images to larger images and restyled. 2022-04-05 01:00:25 -05:00
dd6dc787e9 Match controller now returns user recents if authenticated. 2022-04-05 00:21:34 -05:00
0f480af1f0 Merge branch 'restructure' of https://github.com/csc309-winter-2022/team58 into restructure 2022-04-04 22:50:29 -05:00
7dd862e134 Added U and D endpoints. 2022-04-04 22:50:26 -05:00
Piyush Sharma
489387ec9f
Merge pull request #6 from csc309-winter-2022/carousel
New Carousel
2022-04-04 23:30:36 -04:00
Piyush Sharma
900f98615d Change indicator colour 2022-04-04 23:28:23 -04:00
Piyush Sharma
3124f05544 Added New Carousel 2022-04-04 23:06:59 -04:00
ba566040b1 Rewrite phase 1.
Started improved client code structure.

Implemented session based authentication serverside.

Implemented user, match, and sport database models serverside.

Implemented Controllers for variety of C and R operations of CRUD.
2022-04-04 20:15:43 -05:00
eea74dab09 Began mass reorganizing of project and code structure. 2022-03-07 21:09:52 -06:00
8492c82e4f Merge branch 'main' of https://github.com/csc309-winter-2022/team58 2022-03-07 21:05:15 -06:00
1e62ba70d1 Changed to showing visible participate button. 2022-03-07 20:51:25 -06:00
fba8212aeb Fixed access to dashboard page. 2022-03-07 20:49:43 -06:00
5c7e26a1a9 Added package-lock.json to .gitignore. 2022-03-07 20:37:10 -06:00
Sahni-Arjun
df2071439d changes 2022-03-06 21:59:05 -05:00
Arjun Sahni
e773477fb0
Merge pull request #5 from csc309-winter-2022/develop
Develop
2022-03-06 21:51:05 -05:00
Arjun Sahni
196c36444d
Update README.md 2022-03-06 21:50:24 -05:00
6a9e677043 Created user dashboard. 2022-03-06 20:49:13 -06:00
Hansi Xu
329cc7c74f Merge branch 'main' of https://github.com/csc309-winter-2022/team58 2022-03-06 21:37:58 -05:00
Hansi Xu
30c407563d Fixed chat 2022-03-06 21:37:30 -05:00
Piyush Sharma
4f338a2005 Merge branch 'main' of https://github.com/csc309-winter-2022/team58 2022-03-06 21:35:14 -05:00
Piyush Sharma
b717c94e4e Added comment 2022-03-06 21:35:10 -05:00
caed17bc8e Added user dashboard. 2022-03-06 20:31:17 -06:00
Piyush Sharma
c7cd9481f3
Update README.md 2022-03-06 21:25:18 -05:00
d402a67266 Merged with latest dev branch. 2022-03-06 20:25:07 -06:00
Piyush Sharma
340acfa2ed Updated Readme 2022-03-06 21:22:50 -05:00
Sahni-Arjun
532b5d3876 minor changes 2022-03-06 21:13:11 -05:00
Sahni-Arjun
528cb80c1f minor changes, added navbar to admin 2022-03-06 21:01:56 -05:00
Arjun Sahni
a1ed8d14fa
Merge pull request #4 from csc309-winter-2022/develop
Develop
2022-03-06 20:52:17 -05:00
Arjun Sahni
641eca074f
Merge pull request #3 from csc309-winter-2022/admin
admin functionality
2022-03-06 20:51:53 -05:00
Sahni-Arjun
ae1c05c944 admin functionality 2022-03-06 20:49:04 -05:00
Hansi Xu
7ea36e01e5 Merge branch 'develop' 2022-03-06 20:32:40 -05:00
Hansi Xu
9c583ce5e0 Merge branch 'chat' into develop 2022-03-06 20:31:41 -05:00
Piyush Sharma
61c138f5c3
Merge pull request #2 from csc309-winter-2022/develop
Merging authentication and homepage into main branch
2022-03-06 20:27:55 -05:00
Piyush Sharma
d9b0c827c8
Merge pull request #1 from csc309-winter-2022/authentication
Added Sign in/up, Home, and Navbar
2022-03-06 20:24:01 -05:00
Piyush Sharma
e1befed115 Added Homepage and Navbar 2022-03-06 20:22:23 -05:00
Hansi Xu
0a1323da8a Finally fixed input 2022-03-06 18:15:21 -05:00
Hansi Xu
7e17e1c9e9 Adding profile pics for phase1 (hard coded contacts) 2022-03-06 16:22:26 -05:00
Hansi Xu
ab80301f31 Adding chat components 2022-03-06 15:57:04 -05:00
Hansi Xu
c332594b40 Revert "The chat component"
This reverts commit fa8c2e7cf9.
2022-03-06 15:53:19 -05:00
Hansi Xu
fa8c2e7cf9 The chat component 2022-03-06 15:40:56 -05:00
Piyush Sharma
4c75dc2c75 Cleaned up files 2022-03-05 18:51:36 -05:00
Piyush Sharma
1b86e6260f Added Routing and Sign in/up Pages 2022-03-01 13:32:42 -05:00
82 changed files with 36380 additions and 410 deletions

1
.gitignore vendored
View File

@ -165,3 +165,4 @@ dist
# End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,node # End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,node
**/server/public/**

View File

@ -1 +1,31 @@
# team58 # team58
Sports Matcher is an application that allows users to connect with other athletes, schedule sports meets, and rent sports equipment!
**Built Using**
It is built using the React framework and React Bootstrap library. It uses MongoDB for the database, Express for the server, and Axios for requests.
**Instructions**
To use Sports Matcher, please go to https://hidden-bayou-86321.herokuapp.com
From here you can Sign In or Sign Up.
Signing in as 'admin' will take you to the admin page. You will be able to see a list of current matches, users and suspended users. You will need to click the appropriate button for the correct table to appear.
Every page has a navbar at the top. There is a chat and profile icon. Clicking on the chat icon will take you to the chat page. From the profile icon you can sign out.
**Functionality**
Our app has a fully functioning backend which supports the CRUD functionality for the following entites
1. We have a User entity which has the following attributes: Name, Email and Password, Sports and levels, Griends, Auth level, and suspended status
2. We have a Match which supports the following attributes: Players, Date, Sport and skill, and Location
We also support searching the database for the above entites.
1. Matches can be searched for. They can be sorted and filtered based on location, friends, skill level and date.
2. Users can also be searched for

6
package-lock.json generated Normal file
View File

@ -0,0 +1,6 @@
{
"name": "team58",
"lockfileVersion": 2,
"requires": true,
"packages": {}
}

View File

@ -1,23 +1,350 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # File created using '.gitignore Generator' for Visual Studio Code: https://bit.ly/vscode-gig
# dependencies # Created by https://www.toptal.com/developers/gitignore/api/visualstudiocode,linux,node,python,react
/node_modules # Edit at https://www.toptal.com/developers/gitignore?templates=visualstudiocode,linux,node,python,react
/.pnp
.pnp.js
# testing ### Linux ###
/coverage *~
# production # temporary files which can be created if a process still has a handle open of a deleted file
/build .fuse_hidden*
# misc # KDE directory preferences
.DS_Store .directory
.env.local
.env.development.local
.env.test.local
.env.production.local
# Linux trash folder which might appear on any partition or disk
.Trash-*
# .nfs files are created when an open file is removed but is still being accessed
.nfs*
### Node ###
# Logs
logs
*.log
npm-debug.log* npm-debug.log*
yarn-debug.log* yarn-debug.log*
yarn-error.log* yarn-error.log*
lerna-debug.log*
.pnpm-debug.log*
# Diagnostic reports (https://nodejs.org/api/report.html)
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
*.lcov
# nyc test coverage
.nyc_output
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# Snowpack dependency directory (https://snowpack.dev/)
web_modules/
# TypeScript cache
*.tsbuildinfo
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional stylelint cache
.stylelintcache
# Microbundle cache
.rpt2_cache/
.rts2_cache_cjs/
.rts2_cache_es/
.rts2_cache_umd/
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variable files
.env
.env.development.local
.env.test.local
.env.production.local
.env.local
# parcel-bundler cache (https://parceljs.org/)
.cache
.parcel-cache
# Next.js build output
.next
out
# Nuxt.js build / generate output
.nuxt
dist
# Gatsby files
.cache/
# Comment in the public line in if your project uses Gatsby and not Next.js
# https://nextjs.org/blog/next-9-1#public-directory-support
# public
# vuepress build output
.vuepress/dist
# vuepress v2.x temp and cache directory
.temp
# Docusaurus cache and generated files
.docusaurus
# Serverless directories
.serverless/
# FuseBox cache
.fusebox/
# DynamoDB Local files
.dynamodb/
# TernJS port file
.tern-port
# Stores VSCode versions used for testing VSCode extensions
.vscode-test
# yarn v2
.yarn/cache
.yarn/unplugged
.yarn/build-state.yml
.yarn/install-state.gz
.pnp.*
### Node Patch ###
# Serverless Webpack directories
.webpack/
# Optional stylelint cache
# SvelteKit build / generate output
.svelte-kit
### Python ###
# Byte-compiled / optimized / DLL files
__pycache__/
*.py[cod]
*$py.class
# C extensions
*.so
# Distribution / packaging
.Python
build/
develop-eggs/
dist/
downloads/
eggs/
.eggs/
lib/
lib64/
parts/
sdist/
var/
wheels/
share/python-wheels/
*.egg-info/
.installed.cfg
*.egg
MANIFEST
# PyInstaller
# Usually these files are written by a python script from a template
# before PyInstaller builds the exe, so as to inject date/other infos into it.
*.manifest
*.spec
# Installer logs
pip-log.txt
pip-delete-this-directory.txt
# Unit test / coverage reports
htmlcov/
.tox/
.nox/
.coverage
.coverage.*
nosetests.xml
coverage.xml
*.cover
*.py,cover
.hypothesis/
.pytest_cache/
cover/
# Translations
*.mo
*.pot
# Django stuff:
local_settings.py
db.sqlite3
db.sqlite3-journal
# Flask stuff:
instance/
.webassets-cache
# Scrapy stuff:
.scrapy
# Sphinx documentation
docs/_build/
# PyBuilder
.pybuilder/
target/
# Jupyter Notebook
.ipynb_checkpoints
# IPython
profile_default/
ipython_config.py
# pyenv
# For a library or package, you might want to ignore these files since the code is
# intended to run in multiple environments; otherwise, check them in:
# .python-version
# pipenv
# According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
# However, in case of collaboration, if having platform-specific dependencies or dependencies
# having no cross-platform support, pipenv may install dependencies that don't work, or not
# install all needed dependencies.
#Pipfile.lock
# poetry
# Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
# This is especially recommended for binary packages to ensure reproducibility, and is more
# commonly ignored for libraries.
# https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
#poetry.lock
# PEP 582; used by e.g. github.com/David-OConnor/pyflow
__pypackages__/
# Celery stuff
celerybeat-schedule
celerybeat.pid
# SageMath parsed files
*.sage.py
# Environments
.venv
env/
venv/
ENV/
env.bak/
venv.bak/
# Spyder project settings
.spyderproject
.spyproject
# Rope project settings
.ropeproject
# mkdocs documentation
/site
# mypy
.mypy_cache/
.dmypy.json
dmypy.json
# Pyre type checker
.pyre/
# pytype static type analyzer
.pytype/
# Cython debug symbols
cython_debug/
# PyCharm
# JetBrains specific template is maintained in a separate JetBrains.gitignore that can
# be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
# and can be added to the global gitignore or merged into this file. For a more nuclear
# option (not recommended) you can uncomment the following to ignore the entire idea folder.
#.idea/
### react ###
.DS_*
**/*.backup.*
**/*.back.*
node_modules
*.sublime*
psd
thumb
sketch
### VisualStudioCode ###
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
!.vscode/*.code-snippets
# Local History for Visual Studio Code
.history/
# Built Visual Studio Code Extensions
*.vsix
### VisualStudioCode Patch ###
# Ignore all local history of files
.history
.ionide
# Support for Project snippet scope
# End of https://www.toptal.com/developers/gitignore/api/visualstudiocode,linux,node,python,react
# Custom rules (everything added below won't be overriden by 'Generate .gitignore File' if you use 'Update' option)
server/mongo-data/**

View File

@ -1,70 +1,3 @@
# Getting Started with Create React App # Sports Matcher
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). A CSC309 Project.
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
You may also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can't go back!**
If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
### Code Splitting
This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
### Analyzing the Bundle Size
This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
### Making a Progressive Web App
This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
### Advanced Configuration
This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
### Deployment
This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
### `npm run build` fails to minify
This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)

View File

@ -0,0 +1,41 @@
{
"env": {
"browser": true,
"es2021": true,
"node": true
},
"extends": [
"eslint:recommended",
"plugin:react/recommended",
"plugin:react/jsx-runtime"
],
"parserOptions": {
"ecmaFeatures": {
"jsx": true
},
"ecmaVersion": "latest",
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"indent": [
"error",
4
],
"linebreak-style": [
"warn",
"unix"
],
"quotes": [
"error",
"double"
],
"semi": [
"error",
"always"
],
"no-unused-vars": "warn"
}
}

23
sports-matcher/client/.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*

View File

@ -0,0 +1,70 @@
# Getting Started with Create React App
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
You may also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can't go back!**
If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
### Code Splitting
This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
### Analyzing the Bundle Size
This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
### Making a Progressive Web App
This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
### Advanced Configuration
This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
### Deployment
This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
### `npm run build` fails to minify
This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)

28053
sports-matcher/client/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -1,23 +1,24 @@
{ {
"name": "sports-matcher", "name": "client",
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@emotion/react": "^11.8.1", "@testing-library/jest-dom": "^5.16.3",
"@emotion/styled": "^11.8.1", "@testing-library/react": "^12.1.4",
"@mui/icons-material": "^5.4.4",
"@mui/material": "^5.4.4",
"@testing-library/jest-dom": "^5.16.2",
"@testing-library/react": "^12.1.3",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"axios": "^0.26.1",
"bootstrap": "^5.1.3",
"react": "^17.0.2", "react": "^17.0.2",
"react-bootstrap": "^2.2.2",
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-scripts": "^5.0.0", "react-router-dom": "^6.2.2",
"react-scripts": "5.0.0",
"validator": "^13.7.0",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
"start": "react-scripts start", "start": "NODE_ENV='development' REACT_APP_API_HOST='http://localhost:5000' react-scripts start",
"build": "react-scripts build", "build": "python3 ../scripts/build.py",
"test": "react-scripts test", "test": "react-scripts test",
"eject": "react-scripts eject" "eject": "react-scripts eject"
}, },
@ -38,5 +39,9 @@
"last 1 firefox version", "last 1 firefox version",
"last 1 safari version" "last 1 safari version"
] ]
},
"devDependencies": {
"eslint": "^8.12.0",
"eslint-plugin-react": "^7.29.4"
} }
} }

View File

Before

Width:  |  Height:  |  Size: 3.8 KiB

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 529 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 496 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 396 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 894 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 592 KiB

View File

Before

Width:  |  Height:  |  Size: 5.2 KiB

After

Width:  |  Height:  |  Size: 5.2 KiB

View File

Before

Width:  |  Height:  |  Size: 9.4 KiB

After

Width:  |  Height:  |  Size: 9.4 KiB

View File

@ -0,0 +1,86 @@
import "./styles/Layout.css";
import "./styles/extra.css";
import { useState } from "react";
import { NavLink, Route, Routes, useNavigate } from "react-router-dom";
import Welcome from "./pages/Welcome";
import Navbar from "react-bootstrap/Navbar";
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 Logout from "./pages/Logout";
import Rentals from "./pages/Rentals";
import Admin from "./pages/Administration";
import Login from "./pages/Login";
import Context from "./globals.js";
import Signup from "./pages/Signup";
export default function layout() {
const [globals, setGlobals] = useState({
user: null,
update: (updates, onUpdate) => setGlobals((state) => { return { ...state, ...updates }; }, onUpdate),
navigate: useNavigate()
});
let identityDisplay = (
<Nav>
<li className="nav-item">
<NavLink className="nav-link" to="/login" >Login</NavLink>
</li>
<li className="nav-item">
<NavLink className="nav-link" to="/signup" >Sign up!</NavLink>
</li>
</Nav>
);
if (globals.user) {
identityDisplay = (
<Nav>
<li className="nav-item">
<NavLink className="nav-link" to="/" >Hi, {globals.user.firstName}</NavLink>
</li>
<li className="nav-item">
<NavLink className="nav-link" to="/logout" >Logout</NavLink>
</li>
</Nav>
);
}
return (
<div id="app">
<Context.Provider value={globals}>
<header>
<Navbar bg="light" expand="md">
<Container>
<NavbarBrand href="/">Sports Matcher</NavbarBrand>
<NavbarToggle aria-controls="navigation"></NavbarToggle>
<NavbarCollapse id="main-nav">
<Nav className="me-auto">
<li className="nav-item">
<NavLink className="nav-link" to="/" >Home</NavLink>
</li>
</Nav>
{identityDisplay}
</NavbarCollapse>
</Container>
</Navbar>
</header>
<main>
<Routes>
<Route path="/" element={<Welcome />} />
<Route path="/dashboard" element={<Dashboard />} />
<Route path="/login" element={<Login />} />
<Route path="/signup" element={<Signup />} />
<Route path="/logout" element={<Logout />} />
<Route path="/admin" element={<Admin />} />
<Route path="/rentals" element={<Rentals />} />
</Routes>
</main>
<footer>
</footer>
</Context.Provider>
</div>
);
}

View File

@ -0,0 +1,44 @@
import React from "react";
import globals from "../globals";
import { apiClient } from "../utils/httpClients";
import propTypes from "prop-types";
export default class AuthenticationGuard extends React.Component {
constructor(props) {
super(props);
}
static contextType = globals;
async componentDidMount() {
let userDataResponse = await apiClient.get("/user");
if (userDataResponse.status === 200) {
this.context.update({ user: userDataResponse.data });
if (this.context.user && this.context.user.accessLevel < this.props.accessLevel) {
this.context.navigate("/", { replace: true });
}
} else if (userDataResponse.status == 401) {
this.context.navigate("/signup", { replace: true });
this.context.update({ user: null });
}
}
componentDidUpdate() {
}
render() {
if (this.context.user) {
return this.props.children;
} else {
return null;
}
}
}
AuthenticationGuard.defaultProps = {
accessLevel: 0
};
AuthenticationGuard.propTypes = {
accessLevel: propTypes.number,
children: propTypes.any
};

View File

@ -0,0 +1,53 @@
import React from "react";
import { Carousel } from "react-bootstrap";
export default class HomeCarousel extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<Carousel className="jumbotron" variant="light">
<Carousel.Item>
<img
className="d-block w-100"
src='/images/carousel/volleyball_normalized.jpg'
alt="Connect Slide"
/>
<Carousel.Caption>
<div className="captionStyle">
<h1>Connect</h1>
<h2>Connect with other athletes in your area!</h2>
</div>
</Carousel.Caption>
</Carousel.Item>
<Carousel.Item>
<img
className="d-block w-100"
src='/images/carousel/schedule_normalized.jpg'
alt="Schedule Slide"
/>
<Carousel.Caption>
<div className="captionStyle">
<h1>Schedule</h1>
<h2>Schedule sport meets with other athletes!</h2>
</div>
</Carousel.Caption>
</Carousel.Item>
<Carousel.Item>
<img
src='/images/carousel/rentals_normalized.jpg'
alt="Rent Slide"
className="d-block w-100"
/>
<Carousel.Caption>
<div className="captionStyle">
<h1>Rent</h1>
<h2>Rent sports equipment from other athletes!</h2>
</div>
</Carousel.Caption>
</Carousel.Item>
</Carousel>
);
}
}

View File

@ -0,0 +1,36 @@
import React from "react";
import { Button, Card } from "react-bootstrap";
import propTypes from "prop-types";
import { grammaticalListString } from "../utils/strings";
export default class MatchInfoCard extends React.Component {
constructor(props) {
super(props);
}
getParticipants() {
let participants = [];
this.props.match.participants.forEach(user => {
participants.push(user.firstName);
});
return participants;
}
render() {
return (
<Card style={{ width: "20rem" }}>
<Card.Body>
<Card.Title>{this.props.match.sport.name}</Card.Title>
<Card.Subtitle className="mb-2 text-muted">{this.props.match.title}</Card.Subtitle>
<Card.Text>
Join <strong>{grammaticalListString(this.getParticipants(), 4)}</strong> to play a few matches of <strong>{this.props.match.sport.name}</strong> at <strong>{this.props.match.location.toString()}</strong> on <strong>{new Date(this.props.match.when).toLocaleDateString("en-US")}</strong>!
</Card.Text>
<Button variant="primary">Join!</Button>
</Card.Body>
</Card>
);
}
}
MatchInfoCard.propTypes = {
match: propTypes.object,
};

View File

@ -0,0 +1,24 @@
import React from "react";
import propTypes from "prop-types";
import MatchInfoCard from "./MatchInfoCard";
import "../styles/MatchInfoCardDisplay.css";
export default class MatchInfoCardDisplay extends React.Component {
constructor(props) {
super(props);
}
render() {
let matches = null;
if (this.props.recommendedmatches.length > 0) {
matches = this.props.recommendedmatches.map((match) => <MatchInfoCard key={match._id} match={match}></MatchInfoCard>);
}
return (
<div className="horizontal-scroller">
{matches}
</div>
);
}
}
MatchInfoCardDisplay.propTypes = {
recommendedmatches: propTypes.array,
};

View File

@ -0,0 +1,31 @@
import React from "react";
import { Card } from "react-bootstrap";
//import { Button, Card } from "react-bootstrap";
import propTypes from "prop-types";
//import { grammaticalListString } from "../utils/strings";
export default class MatchInfoCard extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
// <Card style={{ width: "20rem" }}>
<Card>
<Card.Body>
<Card.Title>{this.props.rental.title}</Card.Title>
<Card.Text className="mb-2 text-muted">Rate: {this.props.rental.rate}</Card.Text>
<Card.Text>Date Created: {this.props.rental.createDate}</Card.Text>
<Card.Text>Owner: {this.props.rental.creator}</Card.Text>
<Card.Text>Contact: {this.props.rental.contact}</Card.Text>
<Card.Text>Description: {this.props.rental.description}</Card.Text>
</Card.Body>
</Card>
);
}
}
MatchInfoCard.propTypes = {
rental: propTypes.object,
};

View File

@ -0,0 +1,26 @@
import React from "react";
import { Card } from "react-bootstrap";
import propTypes from "prop-types";
export default class SportInfoCard extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<Card style={{ width: "20rem" }}>
<Card.Body>
<Card.Title>{this.props.sport.name}</Card.Title>
<Card.Subtitle className="mb-2 text-muted">Requires a minimum of {this.props.sport.minPlayers.toString()} players.</Card.Subtitle>
<Card.Text>
{this.props.sport.description}
</Card.Text>
</Card.Body>
</Card>
);
}
}
SportInfoCard.propTypes = {
sport: propTypes.object,
};

View File

@ -0,0 +1,24 @@
import React from "react";
import propTypes from "prop-types";
import SportInfoCard from "./SportInfoCard";
import "../styles/MatchInfoCardDisplay.css";
export default class SportInfoCardDisplay extends React.Component {
constructor(props) {
super(props);
}
render() {
let sports = null;
if (this.props.recommendedsports.length > 0) {
sports = this.props.recommendedsports.map((sport) => <SportInfoCard key={sport._id} sport={sport}></SportInfoCard>);
}
return (
<div className="horizontal-scroller">
{sports}
</div>
);
}
}
SportInfoCardDisplay.propTypes = {
recommendedsports: propTypes.array,
};

View File

@ -0,0 +1,7 @@
import React from "react";
export default React.createContext({
user: null,
update: () => { },
navigate: () => { }
});

View File

@ -0,0 +1,22 @@
import React from "react";
import ReactDOM from "react-dom";
import Layout from "./Layout";
import reportWebVitals from "./reportWebVitals";
import { BrowserRouter } from "react-router-dom";
import "bootstrap/dist/css/bootstrap.min.css"; // This could be optimized by importing individual css components.
console.log(process.env);
ReactDOM.render(
<React.StrictMode>
<BrowserRouter>
<Layout />
</BrowserRouter>
</React.StrictMode>,
document.getElementById("root")
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

View File

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,251 @@
import React from "react";
import { Button, ButtonGroup, Spinner, Table } from "react-bootstrap";
import "../styles/Admin.css";
import globals from "../globals";
import AuthenticationGuard from "../components/AuthenticationGuard";
import { apiClient } from "../utils/httpClients";
export default class Admin extends React.Component {
constructor(props) {
super(props);
// Use null to indicate not loaded
// Use empty array to indicate no items for that state.
this.state = {
users: null,
suspendedUsers: null,
matches: null,
user: null,
currentTab: "matches",
};
}
static contextType = globals;
async componentDidMount() {
await this.loadActiveUsers();
await this.loadSuspendedUsers();
await this.loadMatches();
}
async loadActiveUsers() {
let response = await apiClient.get("/user/all/active");
if (response.status === 200) {
this.setState({ users: response.data.active });
}
}
async loadSuspendedUsers() {
let response = await apiClient.get("/user/all/suspended");
if (response.status === 200) {
this.setState({ suspendedUsers: response.data.suspended });
} else {
console.error(response.status);
}
}
async loadMatches() {
let response = await apiClient.get("/match/all");
if (response.status === 200) {
this.setState({ matches: response.data.all });
}
}
DeleteButton() {
return <Button onClick={() => {
alert("User deleted.");
}} variant="outline-secondary">Delete</Button>;
}
PardonButton() {
return <Button onClick={() => {
alert("User pardoned.");
}} variant="outline-secondary">Pardon</Button>;
}
EditButton() {
return <Button onClick={() => {
alert("clicked");
}} variant="outline-secondary">Edit</Button>;
}
userTableHead() {
return (
<thead>
<tr>
<th>ID</th>
<th>Username</th>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th></th>
<th></th>
</tr>
</thead>
);
}
matchTableHead() {
return (
<thead>
<tr>
<th>ID</th>
<th>Sport</th>
<th>Date</th>
<th>Location</th>
<th></th>
<th></th>
</tr>
</thead>
);
}
userTableData() {
if (!this.state.users) {
return (
<tr>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
</tr>
);
}
return this.state.users.map((user) => {
const { _id, firstName, lastName, email, phone } = user;
return (
<tr key={_id}>
<td>{_id}</td>
<td>{firstName}</td>
<td>{lastName}</td>
<td>{email}</td>
<td>{phone}</td>
<td>{this.DeleteButton()}</td>
<td>{this.EditButton()}</td>
</tr>
);
});
}
susUserTableData() {
if (!this.state.suspendedUsers) {
return (
<tr>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
</tr>
);
}
return this.state.suspendedUsers.map((user) => {
const { _id, firstName, lastName, email, phone } = user;
return (
<tr key={_id}>
<td>{_id}</td>
<td>{firstName}</td>
<td>{lastName}</td>
<td>{email}</td>
<td>{phone}</td>
<td>{this.DeleteButton()}</td>
<td>{this.EditButton()}</td>
<td>{this.PardonButton()}</td>
</tr>
);
});
}
matchTableData() {
if (!this.state.matches) {
return (
<tr>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
<td><Spinner animation="grow" /></td>
</tr>
);
}
return this.state.matches.map((match) => {
const { _id, sport, when, location } = match;
const sportName = sport.name;
return (
<tr key={_id}>
<td>{_id}</td>
<td>{sportName}</td>
<td>{when}</td>
<td>{location}</td>
<td>{this.DeleteButton()}</td>
<td>{this.EditButton()}</td>
</tr>
);
});
}
renderTableHead() {
if (this.state.currentTab === "matches") {
return this.matchTableHead();
} else if (this.state.currentTab === "users") {
return this.userTableHead();
} else {
return this.userTableHead();
}
}
renderTableData() {
if (this.state.currentTab === "matches") {
return this.matchTableData();
} else if (this.state.currentTab === "users") {
return this.userTableData();
} else {
return this.susUserTableData();
}
}
render() {
return (
<div className="page-root">
<AuthenticationGuard accessLevel={3}>
<React.Fragment>
<div className='center'>
<h1 id='title'>Administration</h1>
<ButtonGroup aria-label="Pages">
<Button onClick={() => {
this.setState({ currentTab: "matches" });
}} variant="outline-secondary" active={this.state.currentTab === "matches"}>Matches</Button>
<Button onClick={() => {
this.setState({ currentTab: "users" });
}} variant="outline-secondary" active={this.state.currentTab === "users"}>Users</Button>
<Button onClick={() => {
this.setState({ currentTab: "suspended" });
}} variant="outline-secondary" active={this.state.currentTab === "suspended"}>Suspended Users</Button>
</ButtonGroup>
</div>
<Table striped bordered hover>
{this.renderTableHead()}
<tbody>
{this.renderTableData()}
{/* {this.matchUserTableData()} */}
</tbody>
</Table>
</React.Fragment>
</AuthenticationGuard >
</div>
);
}
}

View File

@ -0,0 +1,71 @@
import React from "react";
import { Button, InputGroup, FormControl } from "react-bootstrap";
import "../styles/Dashboard.css";
import { apiClient } from "../utils/httpClients.js";
import MatchInfoCardDisplay from "../components/MatchInfoCardDisplay";
import SportInfoCardDisplay from "../components/SportInfoCardDisplay";
import AuthenticationGuard from "../components/AuthenticationGuard";
import globals from "../globals";
export default class Dashboard extends React.Component {
constructor(props) {
super(props);
this.state = {
displayedMatches: [],
displayedSports: [],
displayedEquipment: [],
user: null
};
}
static contextType = globals;
async componentDidMount() {
this.setState({ user: this.context.user });
await this.latestMatches();
await this.availableSports();
}
async latestMatches() {
let recentMatchesRes = await apiClient.get("/match/recent/user/15");
if (recentMatchesRes.status === 200) {
this.setState({ displayedMatches: recentMatchesRes.data.recent });
}
}
async availableSports() {
let availableSportsRes = await apiClient.get("/sport");
if (availableSportsRes.status === 200) {
this.setState({ displayedSports: availableSportsRes.data });
}
}
render() {
return (
<AuthenticationGuard>
<div className="page-root">
<React.Fragment>
<h1></h1>
<InputGroup className="w-50">
<FormControl
placeholder="Search for Matches"
aria-label="Search Bar"
aria-describedby="basic-addon2"
/>
<Button variant="outline-secondary" id="button-addon2">
Search
</Button>
</InputGroup>
<div className="p-4">
<h2>Available Matches</h2>
<MatchInfoCardDisplay recommendedmatches={this.state.displayedMatches} />
</div>
<div className="p-4">
<h2>Available Sports</h2>
<SportInfoCardDisplay recommendedsports={this.state.displayedSports} />
</div>
</React.Fragment>
</div>
</AuthenticationGuard>
);
}
}

View File

@ -0,0 +1,87 @@
import React from "react";
import { Alert, Button, Card, Container, Form } from "react-bootstrap";
import globals from "../globals";
import { apiClient } from "../utils/httpClients";
export default class Login extends React.Component {
constructor(props) {
super(props);
this.state = {
email: "",
password: "",
errorDisplayed: false,
};
this.attemptLogin = this.attemptLogin.bind(this);
}
static contextType = globals;
async componentDidMount() {
}
componentDidUpdate() {
if (this.context.user) {
this.context.navigate("/dashboard");
}
}
async attemptLogin(e) {
e.preventDefault();
const loginResponse = await apiClient.post("/user/login", {
email: this.state.email,
password: this.state.password,
});
if (loginResponse.status === 200) {
this.context.update({ user: loginResponse.data });
} else if (loginResponse.status === 401) {
this.setState({ errorDisplayed: true });
}
}
render() {
let errorMsg = (
<div></div>
);
if (this.state.errorDisplayed) {
errorMsg = (
< Alert variant="danger" onClose={() => this.setState({ errorDisplayed: false })} dismissible >
<Alert.Heading>Incorrect credentials</Alert.Heading>
<p>Double check your provided e-mail and password!</p>
</Alert >
);
}
return (
<div className="d-flex justify-content-center align-items-center
page-root">
{errorMsg}
<Container style={{ maxWidth: "35rem" }}>
<Card>
<Card.Body>
<Card.Title>Login</Card.Title>
<Card.Subtitle>Welcome back!</Card.Subtitle>
<Form onSubmit={this.attemptLogin}>
<Form.Group className="mb-3" controlId="loginEmail">
<Form.Label>E-mail</Form.Label>
<Form.Control type="email" placeholder="Ex. youremail@mail.com" onChange={(e) => {
this.setState({ email: e.target.value });
}} />
</Form.Group>
<Form.Group className="mb-3" controlId="loginPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Enter password" onChange={(e) => {
this.setState({ password: e.target.value });
}} />
</Form.Group>
<Button variant="primary" type="submit">
Submit
</Button>
</Form>
</Card.Body>
</Card>
</Container>
</div>
);
}
}

View File

@ -0,0 +1,39 @@
import React from "react";
import globals from "../globals";
import { apiClient } from "../utils/httpClients";
export default class Logout extends React.Component {
constructor(props) {
super(props);
}
static contextType = globals;
async componentDidMount() {
const logoutResponse = await apiClient.get("/user/logout");
if (logoutResponse.status === 200) {
this.redirectTimer = setTimeout(() => {
this.context.navigate("/", { replace: true });
}, 2000);
} else if (logoutResponse.status == 401) {
this.context.navigate("/", { replace: true });
}
this.context.update({ user: null });
}
componentWillUnmount() {
clearTimeout(this.redirectTimer);
}
render() {
return (
<div className="page-root">
<div>
<h1>You are now logged out. See you later!</h1>
<p className="text-muted">We will redirect you shortly...</p>
</div>
</div>
);
}
}

View File

@ -0,0 +1,14 @@
import React from "react";
import { Container } from "react-bootstrap";
export default class Profile extends React.Component {
render() {
return (
<div className="page-root">
<Container>
</Container>
</div>
);
}
}

View File

@ -0,0 +1,89 @@
import React from "react";
import { Button, InputGroup, FormControl } from "react-bootstrap";
import "../styles/Dashboard.css";
// import { apiClient } from "../utils/httpClients.js";
// import MatchInfoCardDisplay from "../components/MatchInfoCardDisplay";
// import SportInfoCardDisplay from "../components/SportInfoCardDisplay";
import RentalInfoCard from "../components/RentalInfoCard";
// import AuthenticationGuard from "../components/AuthenticationGuard";
// import globals from "../globals";
export default class Rentals extends React.Component {
constructor(props) {
super(props);
this.state = {
rentals: [
{ id: 9, creator: "Person5", createDate: "05/21/2022", title: "Horse", rate: "$1000/day", description: "This is an amazing horse, has won many races", contact: "647 765 1234" },
{ id: 7, creator: "Person1", createDate: "05/05/2022", title: "Tennis Racquet", rate: "$300/day", description: "This is an amazing tennis racquet, used by Roger Federer to win Wimbledon in 2003", contact: "123 456 7890" },
{ id: 3, creator: "Person2", createDate: "05/11/2022", title: "Soccer Ball", rate: "$70/day", description: "This is an amazing soccer ball, signed by Messi", contact: "647 822 4321" },
{ id: 2, creator: "Person3", createDate: "05/13/2022", title: "Basket Ball", rate: "$7/day", description: "This is an amazing basketball, same model as the ones used in the NBA", contact: "467 279 4321" },
{ id: 1, creator: "Person4", createDate: "05/18/2022", title: "Table Tennis Racquet", rate: "$7/day", description: "This is an amazing table tennis racquet, it's very good", contact: "326 111 4321" },
]
};
}
// static contextType = globals;
// async componentDidMount() {
// this.setState({ user: this.context.user });
// await this.latestMatches();
// await this.availableSports();
// }
// async latestMatches() {
// let recentMatchesRes = await apiClient.get("/match/recent/user/15");
// if (recentMatchesRes.status === 200) {
// this.setState({ displayedMatches: recentMatchesRes.data.recent });
// }
// }
// async availableSports() {
// let availableSportsRes = await apiClient.get("/sport");
// if (availableSportsRes.status === 200) {
// this.setState({ displayedSports: availableSportsRes.data });
// }
// }
// renderRentals() {
// let matches = null;
// if (this.props.recommendedmatches.length > 0) {
// matches = this.props.recommendedmatches.map((match) => <MatchInfoCard key={match._id} match={match}></MatchInfoCard>);
// }
// return (
// <div className="horizontal-scroller">
// {matches}
// </div>
// );
// }
rentalsCards() {
return this.state.rentals.map((rental) => {
return (<RentalInfoCard key={rental.id} rental={rental}></RentalInfoCard>);
});
}
render() {
return (
<div className="page-root">
<React.Fragment>
<h1></h1>
<InputGroup className="w-50">
<FormControl
placeholder="Search for Rentals"
aria-label="Search Bar"
aria-describedby="basic-addon2"
/>
<Button variant="outline-secondary" id="button-addon2">
Search
</Button>
</InputGroup>
<div className="p-4">
<h2>Available Rentals</h2>
{this.rentalsCards()}
</div>
</React.Fragment>
</div>
);
}
}

View File

@ -0,0 +1,147 @@
import React from "react";
import { Alert, Button, Card, Container, Form } from "react-bootstrap";
import { Link } from "react-router-dom";
import validator from "validator";
import globals from "../globals";
import { apiClient } from "../utils/httpClients";
export default class Signup extends React.Component {
constructor(props) {
super(props);
this.state = {
user: {
email: null,
firstName: null,
lastName: null,
phone: null,
password: null
},
alert: {
show: false,
variant: null,
headerMsg: null,
content: null
}
};
this.registerUser = this.registerUser.bind(this);
this.setUserState = this.setUserState.bind(this);
}
static contextType = globals;
async registerUser(event) {
event.preventDefault();
let formIssues = this.validateCurrentForm();
if (formIssues.length > 0) {
this.notifyUser("Oops there were issue(s)", (
<ul>
{formIssues.map((issue) => {
return (
<li key={issue}>{issue}</li>
);
})}
</ul>
), "danger");
return;
}
const res = await apiClient.post("/user", this.state.user);
if (res.status === 201) {
this.notifyUser("Success!", <div>You are successfully signed up! You wil be directed to <Link to="/login">login</Link> now.</div>, "success");
this.redirectTimer = setTimeout(() => {
this.context.navigate("/signin", { replace: true });
}, 1000);
} else if (res.status === 409) {
this.notifyUser("User exists!", <div>This user already exists. Try <Link to="/login">logging in</Link> instead.</div>, "danger");
} else if (res.status === 400) {
this.notifyUser("There were errors in the submitted info.", <div>Double check to see if everything is inputted is valid.</div>, "danger");
} else {
this.notifyUser("Error", <div>Internal server error. Please try again later.</div>, "danger");
}
}
componentWillUnmount() {
clearTimeout(this.redirectTimer);
}
validateCurrentForm() {
let formIssues = [];
if (!validator.isEmail(this.state.user.email)) {
formIssues.push("The email submitted is invalid.");
}
if (this.state.user.password.length < 8) {
formIssues.push("The password submitted must have a minimum length of 8 characters.");
}
return formIssues;
}
setUserState(event) {
this.setState((state) => {
state.user[event.target.id] = event.target.value;
return state;
});
}
notifyUser(headerMsg, content, key) {
this.setState((state) => {
state.alert.show = true;
state.alert.headerMsg = headerMsg;
state.alert.content = content;
state.alert.key = key;
return state;
});
}
componentDidMount() {
if (this.context.user) {
this.context.navigate("/dashboard");
}
}
render() {
return (
<div className="page-root pt-3">
<Container>
<Alert show={this.state.alert.show} variant="warning" onClose={() => this.setState((state) => { state.alert.show = false; return state; })} dismissible>
<Alert.Heading>{this.state.alert.headerMsg}</Alert.Heading>
{this.state.alert.content}
</Alert>
<Card style={{ width: "35rem" }}>
<Card.Body>
<Card.Title>Sign up!</Card.Title>
<Card.Subtitle>Welcome to Sports Matcher! Already <Link to="/login">have an account</Link>?</Card.Subtitle>
<Form onSubmit={this.registerUser}>
<Form.Group className="mb-3" controlId="firstName">
<Form.Label>First name</Form.Label>
<Form.Control type="text" placeholder="Ex. John" onChange={this.setUserState} required />
</Form.Group>
<Form.Group className="mb-3" controlId="lastName">
<Form.Label>Last name</Form.Label>
<Form.Control type="text" placeholder="Ex. Smith" onChange={this.setUserState} required />
</Form.Group>
<Form.Group className="mb-3" controlId="email">
<Form.Label>E-mail</Form.Label>
<Form.Control type="email" placeholder="Ex. youremail@mail.com" onChange={this.setUserState} required />
</Form.Group>
<Form.Group className="mb-3" controlId="phone">
<Form.Label>Phone number</Form.Label>
<Form.Control type="text" placeholder="Ex. (123) 456-7890" onChange={this.setUserState} />
</Form.Group>
<Form.Group className="mb-3" controlId="password">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Enter password" onChange={this.setUserState} required />
</Form.Group>
<Button variant="primary" type="submit">
Register!
</Button>
</Form>
</Card.Body>
</Card>
</Container>
</div >
);
}
}

View File

@ -0,0 +1,42 @@
import React from "react";
import { apiClient } from "../utils/httpClients";
import HomeCarousel from "../components/HomeCarousel";
import MatchInfoCardDisplay from "../components/MatchInfoCardDisplay";
export default class Welcome extends React.Component {
constructor(props) {
super(props);
this.state = {
displayedMatches: [],
};
}
async componentDidMount() {
await this.latestMatches();
}
async latestMatches() {
let recentMatchesRes = await apiClient.get("/match/recent/15");
if (recentMatchesRes.status === 200) {
this.setState({ displayedMatches: recentMatchesRes.data.recent });
}
}
render() {
return (
<div className="page-root">
<HomeCarousel />
<div className="text-center p-3 mt-2">
<h2>Why?</h2>
<p>Because you want to play the sports you love while meeting new friends!</p>
{/* TODO: All this text should be expanded on. */}
</div>
<hr />
<div className="p-4">
<h2>Available Matches</h2>
<MatchInfoCardDisplay recommendedmatches={this.state.displayedMatches} />
</div>
</div>
);
}
}

View File

@ -0,0 +1,13 @@
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

View File

@ -2,4 +2,4 @@
// allows you to do things like: // allows you to do things like:
// expect(element).toHaveTextContent(/react/i) // expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom // learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom'; import "@testing-library/jest-dom";

View File

@ -0,0 +1,15 @@
.MainTable {
padding : 20px;
}
.center {
text-align: center;
padding: 21px;
}
.somespace {
padding: 17px;
}

View File

@ -0,0 +1,5 @@
.w-50{
margin-top: 5%;
margin-left: 25%;
margin-right: 25%;
}

View File

@ -0,0 +1,16 @@
.page-root,
main,
#app,
#root {
display: flex;
flex-direction: column;
flex-grow: 1;
}
html,
body {
min-height: 100%;
display: flex;
flex-direction: column;
flex-grow: 1;
}

View File

@ -0,0 +1,4 @@
.horizontal-scroller{
display: flex;
overflow-x: auto;
}

View File

@ -0,0 +1,5 @@
.horizontal-scroller {
overflow-x: scroll;
padding-top: 1rem;
padding-bottom: 1rem;
}

View File

@ -0,0 +1,10 @@
import axios from "axios";
export const apiClient = axios.create({
baseURL: (process.env.REACT_APP_API_HOST || "") + "/api/",
timeout: 5000,
withCredentials: process.env.NODE_ENV === "development",
validateStatus: function (status) {
return status === 401 || status === 200 || status === 400 || status === 201;
}
});

View File

@ -0,0 +1,24 @@
export function grammaticalListString(items, max) {
if (!items) return null;
if (max < 1) return "";
let built = "";
let index = 0;
items.forEach(item => {
if (index > max) {
built += "and " + items.length + " more ";
return;
}
built += item;
if (index < items.length - 1) {
built += ", ";
}
if (index == max - 1) {
built += "and ";
}
index += 1;
});
return built;
}

17
sports-matcher/scripts/build.py Executable file
View File

@ -0,0 +1,17 @@
#!/usr/bin/python3
import os
import shutil
DEST_DIR = os.path.abspath("../server/public/")
BUILD_CMD = "react-scripts build"
os.chdir(os.path.abspath(os.path.join(__file__, "../../client")))
errorcode = os.system(BUILD_CMD)
if (errorcode):
print("There was an issue building the client via {}. See above log (exited with error code {}).".format(
BUILD_CMD, errorcode))
else:
print("Received error code of 0. Proceeding with copying files to the public server directory.")
shutil.copytree("./build/", "../server/public/.", dirs_exist_ok=True)
print("Completed copying built files to the public server directory \"{0}\".".format(
DEST_DIR))

View File

@ -0,0 +1 @@
mongod --dbpath ./server/mongo-data

View File

@ -0,0 +1,3 @@
#!/bin/bash
mongod --dbpath ../server/mongo-data

View File

@ -0,0 +1,30 @@
{
"env": {
"es2021": true,
"node": true
},
"extends": "eslint:recommended",
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "module"
},
"rules": {
"indent": [
"error",
4
],
"linebreak-style": [
"warn",
"unix"
],
"quotes": [
"error",
"double"
],
"semi": [
"error",
"always"
],
"no-unused-vars": "warn"
}
}

View File

@ -0,0 +1,16 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Python: Current File",
"type": "python",
"request": "launch",
"program": "${file}",
"console": "integratedTerminal",
"justMyCode": true
}
]
}

View File

@ -0,0 +1,231 @@
import express from "express";
import { requireAdmin, requireAuthenticated } from "../middleware/authority.js";
import { needDatabase } from "../middleware/database.js";
import matchModel from "../schemas/matchModel.js";
import sportModel from "../schemas/sportModel.js";
import userModel from "../schemas/userModel.js";
const MatchController = express.Router();
MatchController.get("/search/:sport", needDatabase, async (req, res) => {
try {
let sport = sportModel.findByName(req.params.sport);
let query = matchModel.find({ sport: sport._id });
query.where("when").gte(Date.now); // We don't want to return any results of matches that have already occurred.
if (req.session.userId) query.where("publicity").gte(1).where("friends").in(req.session.userId);
if (req.query.within) query.where("location").within({ center: req.query.location.split(","), radius: req.query.within });
if (req.query.minDifficulty) query.where("difficulty").gte(req.query.minDifficulty);
if (req.query.maxDifficulty) query.where("difficulty").lte(req.query.maxDifficulty);
if (req.query.beforeDate) query.where("when").lte(req.query.beforeDate);
let queryResults = await query;
res.send({ results: queryResults });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
MatchController.get("/recent/:limit?", needDatabase, async (req, res) => {
try {
let limit = parseInt(req.params.limit);
if (!req.params.limit) limit = 10;
if (isNaN(limit)) {
res.status(400).send("Limit parameter not a number.");
return;
}
if (limit > 50) {
res.status(400).send("Limit greater than maximum limit of 50.");
return;
}
let recent = matchModel.find().where("publicity").gte(2);
recent = await recent.sort({ createDate: -1 }).limit(limit).populate(["sport", "participants"]);
res.status(200).send({ recent: recent });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
MatchController.get("/all", requireAdmin, async (req, res) => {
try {
const allmatches = await matchModel.find().populate("sport");
res.status(200).send({ all: allmatches });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
MatchController.get("/recent/user/:limit", needDatabase, requireAuthenticated, async (req, res) => {
try {
let user = req.user;
let limit = parseInt(req.params.limit);
if (!req.params.limit) limit = 10;
if (isNaN(limit)) {
res.status(400).send("Limit parameter not a number.");
return;
}
let recent = await matchModel.find({ creator: user._id }).sort({ createDate: -1 }).limit(limit).populate(["sport", "participants"]);
res.status(200).send({ recent: recent });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
MatchController.post("/", needDatabase, requireAuthenticated, async (req, res) => {
try {
const userId = req.session.userId;
const user = await userModel.findById(userId);
const match = new matchModel({
title: req.body.title,
when: req.body.when,
public: req.body.public,
location: req.body.location,
creator: userId,
difficulty: req.body.difficulty,
sport: await sportModel.findByName(req.body.sport),
participants: [user._id]
});
if (!match.sport) {
res.status(400).send("Invalid sport name provided.");
return;
}
await match.save();
user.createdMatches.push(match._id);
user.participatingMatches.push(match._id);
await user.save();
res.status(201).send({ createdMatch: match });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
// TODO: Develop the error handling.
}
});
MatchController.patch("/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const match = await matchModel.findById(req.params.id);
if (!match) {
res.status(400).send("Invalid match ID provided.");
return;
}
if (req.user._id !== match.creator && req.user.accessLevel < 3) {
res.status(401).send("Not authorized.");
return;
}
if (req.body._id) {
res.status(400).send("Cannot change ID of match.");
return;
}
if (req.body.creator) {
res.status(400).send("Cannot change creator of match.");
return;
}
await match.updateOne(req.body);
res.status(200).send({ updatedMatch: match });
} catch (error) {
res.status(200).send("Internal server error.");
}
});
MatchController.delete("/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const match = await matchModel.findById(req.params.id);
if (!match) {
res.status(400).send("Invalid match ID provided.");
return;
}
if (req.user._id !== match.creator && req.user.accessLevel < 3) {
res.status(401).send("Not authorized.");
return;
}
await match.deleteOne();
res.status(200).send("Deleted.");
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
MatchController.get("/:id", needDatabase, async (req, res) => {
try {
if (!req.params.id) {
res.status(404).send("Id must be provided to retrieve match");
return;
}
const match = await matchModel.findById(req.params.id).populate("sport");
if (match) {
res.status(200).send({ match: match });
} else {
res.status(404).send("Could not find match with ID: " + req.params.id);
}
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
// TODO: Improve the error handling.
}
});
MatchController.get("/join/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const match = await matchModel.findById(req.params.id);
const user = req.user;
if (!match) {
res.status(400).send("Invalid match ID provided.");
return;
}
if (user.participatingMatches.includes(match._id)) {
res.status(400).send("Already participating in match.");
return;
}
match.participants.push(user._id);
user.participatingMatches.push(match._id);
await match.save();
await user.save();
res.status(200).send("Joined.");
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
MatchController.get("/leave/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const match = await matchModel.findById(req.params.id);
const user = req.user;
if (!match) {
res.status(400).send("Invalid match ID provided.");
return;
}
if (!user.participatingMatches.includes(match._id)) {
res.status(400).send("Not part of match.");
return;
}
const userIndex = match.participants.indexOf(user._id);
match.participants.splice(userIndex, 1);
await match.save();
const matchIndex = user.participatingMatches.indexOf(match._id);
user.participatingMatches.splice(matchIndex, 1);
await user.save();
res.status(200).send("Left match.");
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
export default MatchController;

View File

@ -0,0 +1,115 @@
import express from "express";
import { requireAuthenticated } from "../middleware/authority.js";
import { needDatabase } from "../middleware/database.js";
import rentalModel from "../schemas/rentalModel.js";
import userModel from "../schemas/userModel.js";
const rentalController = express.Router();
rentalController.post("/", needDatabase, requireAuthenticated, async (req, res) => {
try {
const user = req.user;
req.body.createDate = undefined;
req.body.creator = user._id;
const rental = new rentalModel(req.body);
await rental.save();
res.status(201).send({ createdRental: rental });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
rentalController.get("/:id", needDatabase, async (req, res) => {
try {
const rental = await rentalModel.findById(req.params.id).populate("creator");
res.status(200).send({ rental: rental });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
rentalController.get("/recent/:limit?", needDatabase, async (req, res) => {
try {
let user = null;
if (req.session.userId) {
user = await userModel.findById(req.session.userId);
}
let limit = parseInt(req.params.limit);
if (!req.params.limit) limit = 10;
if (isNaN(limit)) {
res.status(400).send("Limit parameter is not a number.");
return;
}
if (isNaN(limit)) {
res.status(400).send("Limit parameter not a number.");
return;
}
if (limit > 50) {
res.status(400).send("Limit greater than maximum limit of 50.");
return;
}
let recent = null;
if (user) {
await user.populate("createdRentals");
recent = user.createdRentals.slice(-limit);
} else {
recent = await rentalModel.find().limit(limit).sort({ createDate: -1 });
}
await recent.populate("members.$");
res.status(200).send({ recent: recent });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
rentalController.patch("/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const rental = await rentalModel.findById(req.params.id);
if (!rental) {
res.status(400).send("Invalid rental ID provided.");
return;
}
if (req.body._id) {
res.status(400).send("Cannot change ID of rental.");
return;
}
if (req.body.creator) {
res.status(400).send("Cannot change creator of rental.");
return;
}
if (req.user._id !== rental.creator && req.user.accessLevel < 3) {
res.status(401).send("Not authorized.");
return;
}
await rental.updateOne(req.body);
res.status(200).send({ updated: rental });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error.");
}
});
rentalController.delete("/:id", needDatabase, requireAuthenticated, async (req, res) => {
try {
const rental = await rentalModel.findById(req.params.id);
if (!rental) {
res.status(400).send("Invalid match ID provided.");
return;
}
if (req.user._id !== rental.creator && req.user.accessLevel < 3) {
res.status(401).send("Not authorized.");
return;
}
await rental.deleteOne();
res.status(200).send("Deleted.");
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
export default rentalController;

View File

@ -0,0 +1,48 @@
import express from "express";
import { requireAuthenticated } from "../middleware/authority.js";
import { needDatabase } from "../middleware/database.js";
import sportModel from "../schemas/sportModel.js";
import userModel from "../schemas/userModel.js";
const SportController = express.Router();
SportController.post("/", needDatabase, requireAuthenticated, async (req, res) => {
const user = await userModel.findById(req.session.userId);
try {
if (user.accessLevel <= 2) {
res.status(403).send("Insufficient privileges.");
return;
}
const sport = new sportModel({
name: req.body.name,
maxPlayers: req.body.maxPlayers,
minPlayers: req.body.minPlayers,
description: req.body.description
});
await sport.save();
res.status(201).send("Successfully created new sport.");
} catch (error) {
res.status(500).send("Internal server error.");
// TODO: Add proper error checking here.
}
});
SportController.get("/:sportId", needDatabase, async (req, res) => {
try {
res.status(200).send(await sportModel.findById(req.params.sportId));
} catch (error) {
res.status(500).send("Internal server error.");
// TODO: Add proper error checking here.
}
});
SportController.get("/", needDatabase, async (req, res) => {
try {
res.status(200).send(await sportModel.find());
} catch (error) {
res.status(500).send("Internal server error.");
// TODO: Add proper error checking here.
}
});
export default SportController;

View File

@ -0,0 +1,218 @@
import express from "express";
import { requireAdmin, requireAuthenticated } from "../middleware/authority.js";
import { needDatabase } from "../middleware/database.js";
import userModel from "../schemas/userModel.js";
import User from "../schemas/userModel.js";
const UserController = express.Router();
UserController.post("/login", needDatabase, async (req, res) => {
try {
const email = req.body.email;
const pwd = req.body.password;
const user = await User.credentialsExist(email, pwd);
if (!user) {
res.sendStatus(401);
return;
} else {
req.session.userId = user._id;
req.session.email = user.email;
user.password = undefined;
res.status(200).send(user);
}
} catch (error) {
if (error.name === "TypeError") {
res.status(400).send("Missing required user info.");
} else if (error.message === "Credentials do not exist.") {
res.status(401).send("Credentials do not exist.");
} else {
console.error(error);
if (process.env.NODE_ENV === "development") {
res.status(500).send(error.toString());
} else {
res.status(500).send("Internal server error. This issue has been noted.");
}
}
}
});
UserController.get("/logout", requireAuthenticated, (req, res) => {
req.session.destroy((err) => {
if (err) {
console.error(err);
if (process.env.NODE_ENV === "development") {
res.status(500).send(err.toString());
} else {
res.status(500).send("Internal server error. This issue has been noted.");
}
res.status(500).send("");
} else {
res.sendStatus(200);
}
});
});
UserController.get("/:id?", needDatabase, requireAuthenticated, async (req, res) => {
let user = null;
if (req.params.id) {
if (req.user.accessLevel > 2) {
user = await userModel.findById(req.params.id);
} else {
res.status(401).send("Unauthorized.");
return;
}
} else {
user = req.user;
}
user.password = undefined;
res.status(200).send(user);
});
UserController.patch("/:id?", needDatabase, requireAuthenticated, async (req, res) => {
try {
let user = null;
if (req.params.id) {
if (req.user.accessLevel > 2) {
user = await userModel.findById(req.params.id);
} else {
res.status(401).send("Unauthorized.");
return;
}
} else {
user = req.user;
}
if (req.body._id) {
res.status(400).send("Cannot change user ID.");
return;
}
if (req.body.createdMatches) {
res.status(400).send("Cannot directly change the list of created matches.");
return;
}
if (req.body.password) {
res.status(400).send("Cannot directly change user password.");
return;
}
if (req.body.participatingMatches) {
res.status(400).send("Cannot directly change the list of participating matches.");
return;
}
if (req.body.joinDate) {
res.status(400).send("Cannot change the join date.");
return;
}
if (req.body.accessLevel && req.user.accessLevel < 3) {
res.status(401).send("Unauthorized to change the access level of this user.");
return;
}
if (req.body.suspend && req.user.accessLevel < 3) {
res.status(401).send("Unauthorized to change the accounts disabled date. ");
return;
}
await user.updateOne(req.body);
res.status(200).send("Updated.");
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
UserController.get("/all", requireAdmin, async (req, res) => {
try {
let all = await userModel.find();
res.status(200).send({ all: all });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
UserController.get("/all/active", requireAdmin, async (req, res) => {
try {
let active = await userModel.find().where("suspend").lt(Date.now());
res.status(200).send({ active: active });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
UserController.get("/all/suspended", requireAuthenticated, async (req, res) => {
try {
let suspended = await userModel.find().where("suspend").gte(Date.now());
res.status(200).send({ suspended: suspended });
} catch (error) {
console.error(error);
res.status(500).send("Internal server error");
}
});
/* TODO: Implement middleware for removing users.
UserController.delete("/:id?", needDatabase, requireAuthenticated, async (req, res) => {
let user = null;
if (req.params.id) {
if (req.user.accessLevel > 2) {
user = await userModel.findById(req.params.id);
} else {
res.status(401).send("Unauthorized.");
return;
}
} else {
user = req.user;
}
await user.deleteOne();
res.status(200).send("Deleted user.");
});
*/
UserController.post("/", needDatabase, async (req, res) => {
try {
const data = {
email: req.body.email,
firstName: req.body.firstName,
lastName: req.body.lastName,
phone: req.body.phone,
password: req.body.password,
};
let createdUser = new User(data);
await createdUser.save();
res.sendStatus(201);
return;
} catch (err) {
if (err.name === "TypeError" || err.name === "ValidationError") {
if (process.env.NODE_ENV === "development") {
console.error(err);
res.status(400).send(err.toString());
} else {
res.status(400).send("Missing required user info.");
}
} else if (err.name === "MongoServerError" && err.message.startsWith("E11000")) {
if (process.env.NODE_ENV === "development") {
console.error(err);
res.status(409).send(err.toString());
} else {
res.status(409).send("User already exists.");
}
} else {
console.error(err);
if (process.env.NODE_ENV === "development") {
res.status(500).send(err.toString());
} else {
res.status(500).send("Internal server error. This issue has been noted.");
}
}
}
});
export default UserController;

View File

@ -0,0 +1,2 @@
export const mongooseDbName = process.env.DB_NAME || "sm_db";
export const mongoURI = process.env.MONGODB_URI || "mongodb://127.0.0.1:27017";

View File

@ -0,0 +1,53 @@
import MongoStore from "connect-mongo";
import session from "express-session";
import { mongooseDbName, mongoURI } from "../database/mongoose.js";
import userModel from "../schemas/userModel.js";
import { checkDatabaseConnection } from "./database.js";
const sessionConf = {
secret: process.env.SESSION_SECRET || "super duper secret string.",
cookie: {
expires: process.env.SESSION_TIMEOUT || 300000,
httpOnly: true,
},
saveUninitialized: false,
resave: false,
};
if (process.env.NODE_ENV === "production") {
sessionConf.cookie.secure = true;
sessionConf.proxy = true;
sessionConf.store = MongoStore.create({ mongoUrl: mongoURI, dbName: mongooseDbName });
}
export const userSession = session(sessionConf);
export async function requireAuthenticated(req, res, next) {
if (!checkDatabaseConnection()) {
req.status(500).send("Internal server error.");
return;
}
if (req.session.userId) {
req.user = await userModel.findById(req.session.userId);
next();
} else {
res.status(401).send("Not authorized.");
return;
}
}
export async function requireAdmin(req, res, next) {
if (!checkDatabaseConnection()) {
req.status(500).send("Internal server error.");
return;
}
if (req.session.userId) {
req.user = await userModel.findById(req.session.userId);
if (req.user.accessLevel < 3) {
res.status(401).send("Not authorized");
return;
}
next();
} else {
res.status(401).send("Not authorized.");
return;
}
}

View File

@ -0,0 +1,13 @@
import mongoose from "mongoose";
export function needDatabase(req, res, next) {
if (!checkDatabaseConnection()) {
res.status(500).send("Internal server error: Database connection faulty.");
} else {
next();
}
}
export function checkDatabaseConnection() {
return mongoose.connection.readyState == 1;
}

5627
sports-matcher/server/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,29 @@
{
"name": "server",
"version": "1.0.0",
"private": true,
"type": "module",
"description": "",
"main": "server.js",
"scripts": {
"develop": "NODE_ENV=development nodemon server.js",
"start": "NODE_ENV=production MONGODB_URI='mongodb+srv://sports-matcher:PFebEO0btV91HjwF@cluster0.bow9f.mongodb.net/myFirstDatabase?retryWrites=true&w=majority' node server.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"eslint": "^8.12.0",
"nodemon": "^2.0.15"
},
"dependencies": {
"bcrypt": "^5.0.1",
"body-parser": "^1.19.2",
"connect-mongo": "^4.6.0",
"cors": "^2.8.5",
"express": "^4.17.3",
"express-session": "^1.17.2",
"mongoose": "^6.2.8",
"validator": "^13.7.0"
}
}

View File

@ -0,0 +1,40 @@
import mongoose from "mongoose";
import ModelNameRegister from "./modelNameRegister.js";
const Types = mongoose.Schema.Types; // Some types require defining from this object.
const matchSchema = new mongoose.Schema({
title: { type: String, required: true, trim: true },
when: { type: Date, required: true },
publicity: { type: Number, required: true, default: 2 },
location: {
type: [Number],
required: true,
validate: {
validator: function (v) {
return v.length === 2;
},
message: "Invalid coordinate format (array not length of 2)."
}
},
creator: { type: Types.ObjectId, ref: ModelNameRegister.User },
participants: { type: [{ type: Types.ObjectId, ref: ModelNameRegister.User }], required: true, default: [] },
difficulty: { type: Number, required: true },
sport: { type: Types.ObjectId, ref: ModelNameRegister.Sport },
createDate: { type: Date, required: true, default: Date.now() }
});
matchSchema.pre("remove", function (next) {
const match = this;
match.populate("creator").populate("participants");
match.participants.forEach(participant => {
const index = participant.participatingMatches.indexOf(match._id);
participant.participatingMatches.splice(index, 1);
});
match.creator.createdMatches.splice(match.creator.createdMatches.indexOf(match._id), 1);
next();
});
export default mongoose.model(ModelNameRegister.Match, matchSchema);

View File

@ -0,0 +1,6 @@
export default {
Match: "match",
User: "user",
Sport: "sport",
Rental: "rental",
};

View File

@ -0,0 +1,23 @@
import mongoose from "mongoose";
import modelNameRegister from "./modelNameRegister.js";
const Types = mongoose.Schema.Types;
const rentalSchema = new mongoose.Schema({
title: { type: String, required: true, trim: true },
rate: { type: String, required: true, trim: true },
description: { type: String, required: true },
contact: { type: String, required: true },
createDate: { type: Date, required: true, default: Date.now() },
creator: { type: Types.ObjectId, ref: modelNameRegister.User }
});
rentalSchema.pre("remove", async function (next) {
const rental = this;
const rentalInd = rental.creator.createdRentals.indexOf(rental._id);
rental.creator.createdRentals.splice(rentalInd, 1);
await rental.save();
next();
});
export default mongoose.model(modelNameRegister.Rental, rentalSchema);

View File

@ -0,0 +1,19 @@
import mongoose from "mongoose";
import ModelNameRegister from "./modelNameRegister.js";
const sportSchema = new mongoose.Schema({
name: { type: String, required: true, unique: true, trim: true },
minPlayers: { type: Number, required: true, default: 1 },
description: { type: String, required: true, trim: true }
});
sportSchema.pre("save", function (next) {
this.name = this.name.toLowerCase();
next();
});
sportSchema.statics.findByName = function (name) {
return this.findOne({ name: name.trim().toLowerCase() });
};
export default mongoose.model(ModelNameRegister.Sport, sportSchema);

View File

@ -0,0 +1,70 @@
import mongoose from "mongoose";
import validator from "validator";
import bcrypt from "bcrypt";
import modelNameRegister from "./modelNameRegister.js";
const Types = mongoose.Schema.Types;
const userSchema = new mongoose.Schema({
email: {
type: String,
required: true,
minlength: 1,
trim: true,
unique: true,
validate: {
validator: validator.isEmail,
message: "String not email.",
}
},
firstName: { type: String, required: true, trim: true },
lastName: { type: String, required: true, trim: true },
joinDate: { type: Date, default: Date.now(), required: true },
phone: { type: Number, required: false, min: 0 },
password: {
type: String,
required: true,
minlength: 8
// TODO: Custom validator for password requirements?
},
createdMatches: { type: [{ type: Types.ObjectId, ref: modelNameRegister.Match }], required: true, default: [] },
participatingMatches: { type: [{ type: Types.ObjectId, ref: modelNameRegister.Match }], required: true, default: [] },
createdRentals: { type: [{ type: Types.ObjectId, ref: modelNameRegister.Rental }], required: true, default: [] },
emailPublicity: { type: Number, required: true, default: 0 },
bioPublicity: { type: Boolean, required: true, default: false },
phonePublicity: { type: Boolean, required: true, default: false },
participatingMatchesPublicity: { type: Boolean, required: true, default: false },
friends: { type: Types.ObjectId, ref: modelNameRegister.User },
accessLevel: { type: Number, required: true, default: 0 },
suspend: { type: Date, required: true, default: Date.now() } // suspend the user until the when the user was created.
});
userSchema.statics.credentialsExist = async function (email, password) {
let userModel = this;
let user = await userModel.findOne({ email: email });
if (!user) {
return Promise.reject(new Error("Credentials do not exist."));
}
if (await bcrypt.compare(password, user.password)) {
return user;
}
};
userSchema.pre("save", function (next) {
let user = this;
if (user.isModified("password")) { // Only perform hashing if the password has changed.
bcrypt.genSalt(10, (err, salt) => {
bcrypt.hash(user.password, salt, (err, hash) => {
if (err) {
throw err; // Probably not, but I'm gonna leave this here for now.
}
user.password = hash;
next();
});
});
} else {
next();
}
});
export default mongoose.model(modelNameRegister.User, userSchema);

View File

@ -0,0 +1,48 @@
import express from "express";
import bodyParser from "body-parser";
import mongoose from "mongoose";
import UserController from "./controllers/userController.js";
import MatchController from "./controllers/matchController.js";
import SportController from "./controllers/sportController.js";
import { userSession } from "./middleware/authority.js";
import { mongooseDbName, mongoURI } from "./database/mongoose.js";
import cors from "cors";
import rentalController from "./controllers/rentalController.js";
const server = express();
const port = process.env.PORT || 5000;
server.use(express.static("public")); // For all client files.
// Connection documentation: https://mongoosejs.com/docs/connections.html
try {
mongoose.connect(mongoURI, {
useNewUrlParser: true,
useUnifiedTopology: true,
dbName: mongooseDbName,
});
} catch (error) {
console.error(error);
}
if (process.env.NODE_ENV === "development") {
console.log("We are running in development mode.");
mongoose.set("bufferCommands", false); // We want to know if there are connection issues immediately for development. Disables globally.
server.use(cors({ credentials: true, origin: "http://localhost:3000" }));
}
// Docs: https://www.npmjs.com/package/body-parser
server.use(bodyParser.json());
server.use(bodyParser.urlencoded({ extended: true }));
server.use(userSession);
server.use("/api/user", UserController);
server.use("/api/match", MatchController);
server.use("/api/sport", SportController);
server.use("/api/rental", rentalController);
server.listen(port, () => {
console.log(`Server listening on port ${port}.`);
});

View File

@ -1,38 +0,0 @@
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

View File

@ -1,17 +0,0 @@
import './App.css';
import Filter from './Filter';
import MatchesList from './MatchesList';
import ReportForm from "./ReportForm";
import SearchBar from './SearchBar';
function App() {
return (
<div className="App">
<main>
<SearchBar />
</main>
</div>
);
}
export default App;

View File

@ -1,20 +0,0 @@
import { Stack, Typography } from "@mui/material";
import MatchInfo from "./matchinfo";
export default function CardSuggestedMatches() {
return (
<div style={{ padding: 25 }}>
<Typography variant="h4" component="div">
Suggested
</Typography>
<Stack sx={{ margin: 2 }} direction="row" spacing={2}>
<MatchInfo>
</MatchInfo>
<MatchInfo>
</MatchInfo>
<MatchInfo>
</MatchInfo>
</Stack >
</div>
);
}

View File

@ -1,65 +0,0 @@
import { InputLabel, MenuItem, Select, TextField, FormControl } from "@mui/material";
export default function Filter() {
return (
<div>
<FormControl sx={{ margin: 2 }}>
<InputLabel id="skill-level-label">Sport</InputLabel>
<Select
labelId="skill-level-label"
id="skill-level"
label="Skill level"
sx={{ width: 100 }}
>
<MenuItem value={-10}>Tennis</MenuItem>
<MenuItem value={10}>Soccer</MenuItem>
<MenuItem value={20}>Golf</MenuItem>
<MenuItem value={30}>Basketball</MenuItem>
</Select>
</FormControl>
<FormControl sx={{ margin: 2 }}>
<InputLabel id="skill-level-label">Level</InputLabel>
<Select
labelId="skill-level-label"
id="skill-level"
label="Skill level"
sx={{ width: 100 }}
>
<MenuItem value={-10}>Everyone</MenuItem>
<MenuItem value={10}>Beginner</MenuItem>
<MenuItem value={20}>Intermediate</MenuItem>
<MenuItem value={30}>Professional</MenuItem>
</Select>
</FormControl>
<FormControl sx={{ margin: 2 }}>
<InputLabel id="skill-level-label">Level</InputLabel>
<Select
labelId="skill-level-label"
id="skill-level"
label="Skill level"
sx={{ width: 100 }}
>
<MenuItem value={-10}>Everyone</MenuItem>
<MenuItem value={10}>Beginner</MenuItem>
<MenuItem value={20}>Intermediate</MenuItem>
<MenuItem value={30}>Professional</MenuItem>
</Select>
</FormControl>
<FormControl sx={{ margin: 2 }}>
<TextField id="outlined-basic" label="Date" variant="outlined" />
</FormControl>
<FormControl sx={{ margin: 2 }}>
<TextField id="outlined-basic" label="Time" variant="outlined" />
</FormControl>
<FormControl sx={{ margin: 2 }}>
<TextField id="outlined-basic" label="Location" variant="outlined" />
</FormControl>
<FormControl sx={{ margin: 2 }}>
<TextField id="outlined-basic" label="Radius" variant="outlined" />
</FormControl>
</div>
);
}

View File

@ -1,30 +0,0 @@
import * as React from 'react';
import ListItem from '@mui/material/ListItem';
import ListItemText from '@mui/material/ListItemText';
import Typography from '@mui/material/Typography';
import SportsTennisIcon from '@mui/icons-material/SportsTennis';
import { ListItemIcon } from '@mui/material';
export default function ListSuggestedMatch() {
return (<ListItem alignItems="flex-start">
<ListItemIcon>
<SportsTennisIcon />
</ListItemIcon>
<ListItemText
primary="Tennis - King of The Court"
secondary={
<React.Fragment>
<Typography
sx={{ display: 'inline' }}
component="span"
variant="body2"
color="text.primary"
>
12:30PM - 123 Alphabet St. Toronto ON.
</Typography>
{" — John Smith, Alfred Baker, and Samantha Wright"}
</React.Fragment>
}
/>
</ListItem>);
}

View File

@ -1,14 +0,0 @@
import * as React from 'react';
import List from '@mui/material/List';
import Divider from '@mui/material/Divider';
import ListSuggestedMatch from './ListSuggestedMatch';
export default function MatchesList() {
return (
<List sx={{ width: '100%' }}>
<ListSuggestedMatch></ListSuggestedMatch>
<Divider variant="inset" component="li" />
{/* TODO: Loop to populate */}
</List>
);
}

View File

@ -1,21 +0,0 @@
import FormControl from "@mui/material/FormControl";
import OutlinedInput from "@mui/material/OutlinedInput";
import TextField from "@mui/material/TextField";
export default function ReportForm() {
return (
<FormControl sx={{ width: '80%' }}>
<OutlinedInput
sx={{ margin: 1 }}
placeholder="Please enter user email." />
<TextField
id="outlined-multiline-static"
label="Multiline"
multiline
rows={5}
sx={{ margin: 1 }}
defaultValue="Reason for suspension..."
/>
</FormControl>
);
}

View File

@ -1,11 +0,0 @@
import { Button, TextField } from "@mui/material";
export default function SearchBar() {
return (
<div>
<TextField sx={{ margin: 1 }} id="standard-basic" label="Search" variant="outlined" />
<Button sx={{ margin: 1 }} variant="outlined">Search</Button>
<Button sx={{ margin: 1 }} variant="outlined">Filter</Button>
</div>
);
}

View File

@ -1,13 +0,0 @@
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}

View File

@ -1,17 +0,0 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

View File

@ -1,54 +0,0 @@
import * as React from 'react';
import Card from '@mui/material/Card';
import { List, ListItemAvatar } from '@mui/material';
import { ListItem } from '@mui/material';
import { ListItemText } from '@mui/material';
import PeopleIcon from '@mui/icons-material/People';
import SportsIcon from '@mui/icons-material/Sports';
import MapIcon from '@mui/icons-material/Map';
import EventIcon from '@mui/icons-material/Event';
import CardActions from '@mui/material/CardActions';
import CardContent from '@mui/material/CardContent';
import Button from '@mui/material/Button';
import Typography from '@mui/material/Typography';
export default function MatchInfo() {
return (
<Card sx={{ maxWidth: 400 }}>
<CardContent>
<Typography sx={{ fontSize: 24 }} component="div">
King of the Court!
</Typography>
<List>
<ListItem>
<ListItemAvatar>
<SportsIcon />
</ListItemAvatar>
<ListItemText primary="Sport" secondary="Tennis" />
</ListItem>
<ListItem>
<ListItemAvatar>
<PeopleIcon />
</ListItemAvatar>
<ListItemText primary="Participants" secondary="John Smith, Bob Williams, and Candice Baker" />
</ListItem>
<ListItem>
<ListItemAvatar>
<MapIcon />
</ListItemAvatar>
<ListItemText primary="Location" secondary="Athletic Center - 55 Harbord St, Toronto, ON M5S 2W6" />
</ListItem>
<ListItem>
<ListItemAvatar>
<EventIcon />
</ListItemAvatar>
<ListItemText primary="Time" secondary="1:00PM Tomorrow (January 13th)" />
</ListItem>
</List>
</CardContent>
<CardActions>
<Button size="Medium">Participate</Button>
</CardActions>
</Card>
);
}

View File

@ -1,13 +0,0 @@
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;