diff --git a/client/src/pages/AdminDashboard.js b/client/src/pages/AdminDashboard.js index cedcb417..c8ef8d04 100644 --- a/client/src/pages/AdminDashboard.js +++ b/client/src/pages/AdminDashboard.js @@ -9,9 +9,17 @@ import useAuth from '../hooks/useAuth'; import '../sass/Dashboard.scss'; const AdminDashboard = (props) => { + const [brigades, setBrigades] = useState([]); const [events, setEvents] = useState([]); const [nextEvent, setNextEvent] = useState([]); const [isCheckInReady, setIsCheckInReady] = useState(); + const [brigade, setBrigade] = useState("All"); + const [checkIns, setCheckIns] = useState(null); + const [volunteers, setVolunteers] = useState(null); + const [totalVolunteers, setTotalVolunteers] = useState(null); + const [satisfiedVolunteers, setSatisfiedVolunteers] = useState(null); + const [dtlaEvents, setDtlaEvents] = useState(null); + const [westsideEvents, setWestsideEvents] = useState(null); const [users, setUsers] = useState([]); const [tabSelected, setTabSelected] = useState(); const [optionSelected, setOptionSelected] = useState("left"); @@ -21,8 +29,64 @@ const AdminDashboard = (props) => { const auth = useAuth(); - async function getNextEvent() { + async function getAndSetBrigadeEvents() { + try { + const events = await fetch('/api/events'); + const eventsJson = await events.json(); + + const hackNights = eventsJson.map(event => { + const { hacknight, _id } = event; + return { hacknight, _id }; + }); + + + + const dtlaEvents = hackNights.filter(event => { + return event.hacknight === "DTLA"; + }); + + setDtlaEvents(dtlaEvents); + + const westsideEvents = hackNights.filter(event => { + return event.hacknight === "Westside"; + }); + + setWestsideEvents(westsideEvents); + + + console.log(hackNights); + console.log(dtlaEvents); + console.log(westsideEvents); + + } catch(error) { + console.log(error); + } + } + + async function getCheckIns() { + try { + const checkIns = await fetch('/api/checkins'); + const checkInsJson = await checkIns.json(); + + setCheckIns(checkInsJson); + } catch(error) { + console.log(error); + } + } + async function getUsers() { + try { + const users = await fetch('/api/users'); + const usersJson = await users.json(); + + setVolunteers(usersJson); + setTotalVolunteers(usersJson); + } catch(error) { + console.log(error); + } + } + + async function getNextEvent() { try { const events = await fetch('/api/events'); const eventsJson = await events.json(); @@ -101,9 +165,71 @@ const AdminDashboard = (props) => { } } + const handleBrigadeChange = (e) => { + setBrigade(e.currentTarget.value); + + if (e.currentTarget.value === "DTLA") { + let dtlaVolunteersArray = []; + + for (let eventCount = 0; eventCount < dtlaEvents.length; eventCount++) { + const dtlaVolunteers = checkIns.filter(checkIn => { + return checkIn.eventId === dtlaEvents[eventCount]._id; + }); + + dtlaVolunteersArray.push(dtlaVolunteers); + } + + const flattenedArray = [].concat(...dtlaVolunteersArray); + + const uniqueVolunteers = Array.from(new Set(flattenedArray.map(volunteer => volunteer.userId))); + + setVolunteers(uniqueVolunteers); + } + + if (e.currentTarget.value === "Westside") { + let westsideVolunteersArray = []; + + for (let eventCount = 0; eventCount < westsideEvents.length; eventCount++) { + const westsideVolunteers = checkIns.filter(checkIn => { + return checkIn.eventId === westsideEvents[eventCount]._id; + }); + + westsideVolunteersArray.push(westsideVolunteers); + } + + const flattenedArray = [].concat(...westsideVolunteersArray); + + const uniqueVolunteers = Array.from(new Set(flattenedArray.map(volunteer => volunteer.userId))); + + setVolunteers(uniqueVolunteers); + } + + if (e.currentTarget.value === "All") { + // const usersToCount = checkIns.filter((checkIn, index) => { + // return checkIns.indexOf(checkIn) === index; + // }); + + setVolunteers(totalVolunteers); + } + }; + + const handleSatisfiedChange = (e) => { + if (e.currentTarget.value === "DTLA") { + const satisfiedVolunteers = totalVolunteers.filter(volunteer => { + return volunteer.currentRole === volunteer.desiredRole; + }); + + setSatisfiedVolunteers(satisfiedVolunteers); + } + } + + const brigadeSelection = ["All", "DTLA", "Westside"]; + useEffect(() => { + getAndSetBrigadeEvents(); getNextEvent(); - + getUsers(); + getCheckIns(); }, []); return ( @@ -150,110 +276,200 @@ const AdminDashboard = (props) => {
No events coming up!
)} -
- {events && users ? ( -
- - -
- ) : ( -
- - +
+
+
+
Total Volunteers:
+ +
e.preventDefault()}> +
+
+
+ +
+
+
+
+
+ +
+

{volunteers !== null && volunteers.length}

+
- )} +
- {!eventsIsSelected && !usersIsSelected ? ( -
-

^ Select an option above to get started.

-
- ) : ( - null - )} + {/*
+
+
+
Current Role = Desired Role
- {tabSelected ? ( -
- + -
- ) : ( - null - )} +
e.preventDefault()}> +
+
+
+ +
+
+
+
+
+ +
+

{satisfiedVolunteers !== null && satisfiedVolunteers.length}

+
+
+
*/} + + {/*
+

Total Check-Ins:

+ +
{checkIns !== null && checkIns.length}
+ +
e.preventDefault()}> +
+
+
+ +
+
+
+
+
*/} + +
+ {events && users ? ( +
+ + +
+ ) : ( +
+ + +
+ )} + + {!eventsIsSelected && !usersIsSelected ? ( +
+

^ Select an option above to get started.

+
+ ) : ( + null + )} + + {tabSelected ? ( +
+ + +
+ ) : ( + null + )} + + {eventsIsSelected ? ( +
+ + +
+ ) : ( + null + )} + + {usersIsSelected ? ( +
+ + +
+ ) : ( + null + )} +
+ {eventsIsSelected ? ( -
- - -
+
+ +
) : ( null )} {usersIsSelected ? ( -
- - -
+
+ +
) : ( null )}
- - - {eventsIsSelected ? ( -
- -
- ) : ( - null - )} - - {usersIsSelected ? ( -
- -
- ) : ( - null - )}
- ) : ( ) diff --git a/client/src/pages/CheckInForm.js b/client/src/pages/CheckInForm.js index f48cdf75..3d5b9bed 100644 --- a/client/src/pages/CheckInForm.js +++ b/client/src/pages/CheckInForm.js @@ -83,7 +83,7 @@ const CheckInForm = (props) => { const months = ["JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC"]; const years = ["2020", "2019", "2018", "2017", "2016", "2015", "2014", "2013"]; - const reasons = ["--SELECT ONE--", "Open Data", "Homelessness", "Social Justice/Equity", "Transportation", "Mental Health", "Civic Engagement"]; + const reasons = ["--SELECT ONE--", "Open Data", "Homelessness", "Social Justice/Equity", "Transportation", "Mental Health", "Civic Engagement", "Environment"]; const projects = ["--SELECT ONE--", "311 Data", "Engage", "Food Oasis", "HackforLA.org Website", "HelloGOV", "Lucky Parking", "Metro On-time", "New Schools Today", "Not Today", "Public Tree Map", "Record Clearance", "Shared Housing Project", "TDM Calculator", "Triage Tracker", "Undebate", "VRMS"]; const submitForm = (userForm) => { diff --git a/client/src/sass/Dashboard.scss b/client/src/sass/Dashboard.scss index 257fa957..14c814c2 100644 --- a/client/src/sass/Dashboard.scss +++ b/client/src/sass/Dashboard.scss @@ -12,6 +12,62 @@ border-radius: 6px; } +.dashboard-stats { + display: flex; + margin: 6px; + padding: 6px 6px 6px 6px; + border: 1px solid black; + border-radius: 6px; +} + +.dashboard-stat-container { + display: inline-flex; + flex: 1; + justify-content: space-around; +} + +.stat { + display: flex; + flex-direction: column; + flex: 3; +} + +.stats-form-row { + max-width: 200px; + width: 200px; + margin: 6px 0px; + + p { + text-align: left; + font-weight: bold; + letter-spacing: .05em; + } +} + +.stat-select { + display: flex; + + select { + max-width: 180px; + } +} + +.stat-number { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + font-size: 48px; + font-family: sans-serif; + color: rgb(250, 17, 79); + flex: 2; + + p { + margin: 0px; + padding: 0px; + } +} + .dashboard-nav { display: flex; flex-direction: column; diff --git a/config/database.js b/config/database.js index ec089715..05f37ef8 100644 --- a/config/database.js +++ b/config/database.js @@ -1,3 +1,4 @@ exports.PORT = process.env.PORT || 4000; -exports.DATABASE_URL = process.env.DATABASE_URL || 'mongodb://localhost:27017/db'; +exports.DATABASE_URL = process.env.DATABASE_URL || 'mongodb://localhost:27017/testdb'; exports.TEST_DATABASE_URL = process.env.TEST_DATABASE_URL || 'mongodb://localhost:27017/testdb'; +exports.LIVE_DATABASE_URL = process.env.LIVE_DATABASE_URL || 'mongodb://localhost:27017/testdb'; diff --git a/routers/checkIns.router.js b/routers/checkIns.router.js index 152046f4..3f5c3c70 100644 --- a/routers/checkIns.router.js +++ b/routers/checkIns.router.js @@ -3,14 +3,13 @@ const router = express.Router(); const { CheckIn } = require('../models/checkIn.model'); -// GET /api/checkIns/ +// GET /api/checkins/ router.get('/', (req, res) => { CheckIn .find() .then(checkIns => { res.json(checkIns); - console.log(checkIns); }) .catch(err => { console.log(err); @@ -26,7 +25,6 @@ router.get('/:id', (req, res) => { .findById(req.params.id) .then(checkIn => { res.json(checkIn); - console.log(checkIn); }) .catch(err => { console.log(err); diff --git a/vrms.md b/vrms.md new file mode 100644 index 00000000..e37ed236 --- /dev/null +++ b/vrms.md @@ -0,0 +1,16 @@ +--- +title: VRMS +description: VRMS is a tool used for the engagement, support, and retention of a network of volunteers. +image: /assets/images/projects/311.jpg +alt: "VRMS homepage showing the check-in buttons" +links: + - name: Github + url: 'https://github.com/hackforla/VRMS' + - name: Site + url: 'vrms.io' + +looking: Currently seeking front end and back end developers at any level (from Junior to Lead) +location: Santa Monica, Downtown LA +partner: TBD +status: Active +--- \ No newline at end of file