setUserShow(false)}
55 | user={user}
56 | />
57 | )}
58 |
59 | );
60 | };
61 |
62 | const mapStateToProps = state => {
63 | return {
64 | currentUser: state.user.currentUser,
65 | userMatches: state.user.allUserMatches,
66 | themeRedux: state.theme.theme,
67 | };
68 | };
69 |
70 | export default connect(mapStateToProps)(MenteeMentorDashboard);
71 |
--------------------------------------------------------------------------------
/src/components/common/DialogButton/ScheduleButton.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import 'antd/dist/antd.css';
3 | import { DatePicker, TimePicker, Select, Space, Row, Col } from 'antd';
4 | import { Form } from 'antd';
5 | import '../styles/Calendar.css';
6 |
7 | const { Option } = Select;
8 |
9 | const SwitchablePicker = () => {
10 | const handleChange = value => {
11 | console.log(`selected ${value}`);
12 | };
13 |
14 | return (
15 |
16 |
17 |
26 |
27 |
37 |
38 |
48 |
49 |
50 |
60 |
61 |
62 |
63 |
69 |
70 |
71 |
72 |
73 | );
74 | };
75 |
76 | // eslint-disable-next-line import/no-anonymous-default-export
77 | export default () => ;
78 |
--------------------------------------------------------------------------------
/src/hooks/useForms.js:
--------------------------------------------------------------------------------
1 | import { useState } from 'react';
2 |
3 | export default function useForms(initialValues) {
4 | const [formValues, setFormValues] = useState(initialValues);
5 |
6 | const newMentor = formValues => {
7 | return {
8 | city: formValues['city'],
9 | commitment: formValues['commitment'],
10 | country: formValues['country'],
11 | current_company: formValues['current_company'],
12 | current_position: formValues['current_position'],
13 | email: formValues['email'],
14 | first_name: formValues['first_name'],
15 | industry_knowledge: formValues['industry_knowledge'],
16 | job_help: formValues['job_help'],
17 | last_name: formValues['last_name'],
18 | other_info: formValues['other_info'],
19 | pair_programming: formValues['pair_programming'],
20 | profile_id: formValues['profile_id'],
21 | referred_by: formValues['referred_by'],
22 | state: formValues['state'],
23 | tech_stack: formValues['tech_stack'],
24 | validate_status: formValues['validate_status'],
25 | };
26 | };
27 |
28 | const handleChange = (e, type, targetName) => {
29 | let name;
30 | let value;
31 | if (type === 'select') {
32 | name = targetName;
33 | value = e;
34 | } else if (type === 'checkbox') {
35 | name = e.target.name;
36 | value = e.target.value;
37 | } else if (type === 'radio') {
38 | name = e.target.name;
39 | value = e.target.value;
40 | } else if (e.target.type === 'text') {
41 | name = e.target.id;
42 | value = e.target.value;
43 | } else {
44 | name = e.target.name;
45 | value = e.target.value;
46 | }
47 | setFormValues({ ...formValues, [name]: value });
48 | };
49 |
50 | const handleTechStack = e => {
51 | const { value } = e.target;
52 | let arr = [...formValues.tech_stack];
53 | if (e.target.checked) {
54 | arr = [...formValues.tech_stack, value];
55 | } else {
56 | arr = formValues.tech_stack.filter(e => e !== value);
57 | }
58 | setFormValues({ ...formValues, tech_stack: arr });
59 | };
60 |
61 | const clearForm = () => {
62 | setFormValues(initialValues);
63 | };
64 |
65 | return {
66 | formValues,
67 | newMentor,
68 | handleChange,
69 | clearForm,
70 | setFormValues,
71 | handleTechStack,
72 | };
73 | }
74 |
--------------------------------------------------------------------------------
/src/components/pages/Navbar/Navbar.less:
--------------------------------------------------------------------------------
1 | .logoDiv {
2 | display: flex;
3 | justify-content: space-between;
4 | height: 100%;
5 | }
6 |
7 | .logoDiv img {
8 | cursor: pointer;
9 | }
10 |
11 | .logoImg {
12 | margin-left: 1vw;
13 | }
14 |
15 | .userInfo-and-profilePic {
16 | display: flex;
17 | height: 100%;
18 | flex-direction: row;
19 | justify-content: center;
20 | align-items: center;
21 | padding: 0.5vw;
22 | color: white;
23 | }
24 |
25 | .userInfo {
26 | display: flex;
27 | justify-content: center;
28 | padding: 0.5vw;
29 | color: white;
30 | }
31 |
32 | .username {
33 | display: flex;
34 | height: 3vh;
35 | align-items: center;
36 | cursor: pointer;
37 | }
38 |
39 | .profilePic {
40 | padding: 0vh 1vw;
41 | }
42 |
43 | .memo-icon {
44 | padding: 0.5vw;
45 | }
46 | .memos {
47 | padding-right: 3vw;
48 | }
49 |
50 | /* Mentor nav styles */
51 | #mentorSwitch {
52 | background-color: #73d13d;
53 | }
54 |
55 | .mentorStatus {
56 | height: 100%;
57 | width: 18%;
58 | margin-left: auto;
59 | display: flex;
60 | justify-content: right;
61 | align-items: center;
62 | margin-right: 1%;
63 | }
64 |
65 | .toggleText {
66 | color: white;
67 | margin-left: 3%;
68 | }
69 |
70 | .ant-layout {
71 | position: sticky;
72 | top: 0px;
73 | z-index: 1;
74 | }
75 | @media (max-width: 750px) {
76 | .logoDiv {
77 | display: flex !important;
78 | justify-content: space-between !important;
79 | width: 100% !important;
80 | }
81 | .userInfo-and-profilePic {
82 | display: flex !important;
83 | flex-direction: row !important;
84 | justify-content: space-evenly !important;
85 | width: 100%;
86 | font-size: 1em;
87 | }
88 | .memos {
89 | display: flex;
90 | flex-direction: row;
91 | padding: none;
92 | }
93 | .memo-icon {
94 | display: flex !important;
95 | align-items: center !important;
96 | justify-content: center;
97 | }
98 | .menuBar {
99 | display: flex !important;
100 | width: 100% !important;
101 | }
102 | .layout {
103 | width: 100vw !important;
104 | padding: none !important;
105 | }
106 | .ant-layout-header {
107 | padding: 0% !important;
108 | display: flex !important;
109 | justify-content: space-evenly !important;
110 | }
111 | }
112 |
--------------------------------------------------------------------------------
/CODE_OF_CONDUCT.md:
--------------------------------------------------------------------------------
1 | # Contributor Covenant Code of Conduct
2 |
3 | ## Our Pledge
4 |
5 | In the interest of fostering an open and welcoming environment, we as
6 | contributors and maintainers pledge to making participation in our project and
7 | our community a harassment-free experience for everyone, regardless of age, body
8 | size, disability, ethnicity, sex characteristics, gender identity and expression,
9 | level of experience, education, socio-economic status, nationality, personal
10 | appearance, race, religion, or sexual identity and orientation.
11 |
12 | ## Our Standards
13 |
14 | Examples of behavior that contributes to creating a positive environment
15 | include:
16 |
17 | - Using welcoming and inclusive language
18 | - Being respectful of differing viewpoints and experiences
19 | - Gracefully accepting constructive criticism
20 | - Focusing on what is best for the community
21 | - Showing empathy towards other community members
22 |
23 | Examples of unacceptable behavior by participants include:
24 |
25 | - The use of sexualized language or imagery and unwelcome sexual attention or
26 | advances
27 | - Trolling, insulting/derogatory comments, and personal or political attacks
28 | - Public or private harassment
29 | - Publishing others' private information, such as a physical or electronic
30 | address, without explicit permission
31 | - Other conduct which could reasonably be considered inappropriate in a
32 | professional setting
33 |
34 | ## Our Responsibilities
35 |
36 | Project maintainers are responsible for clarifying the standards of acceptable
37 | behavior and are expected to take appropriate and fair corrective action in
38 | response to any instances of unacceptable behavior.
39 |
40 | Project maintainers have the right and responsibility to remove, edit, or
41 | reject comments, commits, code, wiki edits, issues, and other contributions
42 | that are not aligned to this Code of Conduct, or to ban temporarily or
43 | permanently any contributor for other behaviors that they deem inappropriate,
44 | threatening, offensive, or harmful.
45 |
46 | ## Attribution
47 |
48 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
49 | available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
50 |
51 | [homepage]: https://www.contributor-covenant.org
52 |
53 | For answers to common questions about this code of conduct, see
54 | https://www.contributor-covenant.org/faq
55 |
--------------------------------------------------------------------------------
/src/components/pages/AdminMeetingsDashBoard/CrudModals/DeleteModal.js:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import 'antd/dist/antd.css';
3 | import { Button, Modal } from 'antd';
4 | import DynamicDropdown from '../DynamicDropdown';
5 | import useAxiosWithAuth0 from '../../../../hooks/useAxiosWithAuth0';
6 | const DeleteModal = props => {
7 | const axiosWithAuth = useAxiosWithAuth0();
8 | const { meetings } = props;
9 | const [isModalOpen, setIsModalOpen] = useState(false);
10 | const [error, setError] = useState('');
11 | const [form, setForm] = useState({ INPUT: '' });
12 | const { setMeetings } = props;
13 |
14 | const showModal = () => {
15 | setIsModalOpen(true);
16 | };
17 |
18 | const processedMeetingsArray = meetings.map(meeting => {
19 | const entry = {
20 | value: meeting.meeting_id,
21 | label: meeting.meeting_id,
22 | name: 'meeting_id',
23 | };
24 | return entry;
25 | });
26 |
27 | const handleOk = evt => {
28 | evt.preventDefault();
29 |
30 | axiosWithAuth
31 | .delete(`${process.env.REACT_APP_API_URI}meetings/${form.INPUT}`)
32 | .then(res => {
33 | setMeetings(
34 | meetings.filter(meeting => meeting.meeting_id !== form.INPUT)
35 | );
36 | setIsModalOpen(false);
37 | setForm({
38 | ...form,
39 | INPUT: '',
40 | });
41 | })
42 | .catch(err => {
43 | setError(err);
44 | });
45 | setForm({
46 | ...form,
47 | INPUT: '',
48 | });
49 | };
50 |
51 | const handleCancel = () => {
52 | setForm({
53 | INPUT: '',
54 | });
55 | setIsModalOpen(false);
56 | };
57 | const handleAntChange = (value, option) => {
58 | setForm({ INPUT: value, [option.name]: value });
59 | };
60 |
61 | return (
62 | <>
63 |
66 |
72 | Insert the ID you would like to delete:
73 |
81 |
82 |
83 | {error}
84 |
85 |
86 |
87 | );
88 | };
89 | export default DeleteModal;
90 |
--------------------------------------------------------------------------------
/src/components/pages/MentorMeetingsDashBoard/CrudModals/DeleteModal.js:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import 'antd/dist/antd.css';
3 | import { Button, Modal } from 'antd';
4 | import DynamicDropdown from '../DynamicDropdown';
5 | import useAxiosWithAuth0 from '../../../../hooks/useAxiosWithAuth0';
6 | const DeleteModal = props => {
7 | const axiosWithAuth = useAxiosWithAuth0();
8 | const { meetings } = props;
9 | const [isModalOpen, setIsModalOpen] = useState(false);
10 | const [error, setError] = useState('');
11 | const [form, setForm] = useState({ INPUT: '' });
12 | const { setMeetings } = props;
13 |
14 | const showModal = () => {
15 | setIsModalOpen(true);
16 | };
17 | const processedMeetingsArray = meetings.map(meeting => {
18 | const entry = {
19 | value: meeting.meeting_id,
20 | label: meeting.meeting_id,
21 | name: 'meeting_id',
22 | };
23 | return entry;
24 | });
25 |
26 | const handleOk = evt => {
27 | evt.preventDefault();
28 |
29 | axiosWithAuth
30 | .delete(`${process.env.REACT_APP_API_URI}meetings/${form.INPUT}`)
31 | .then(res => {
32 | setMeetings(
33 | meetings.filter(meeting => meeting.meeting_id !== form.INPUT)
34 | );
35 | setIsModalOpen(false);
36 | setForm({
37 | ...form,
38 | INPUT: '',
39 | });
40 | })
41 | .catch(err => {
42 | setError(err);
43 | });
44 | setForm({
45 | ...form,
46 | INPUT: '',
47 | });
48 | };
49 |
50 | const handleCancel = () => {
51 | setForm({
52 | INPUT: '',
53 | });
54 |
55 | setIsModalOpen(false);
56 | };
57 | const handleAntChange = (value, option) => {
58 | setForm({ INPUT: value, [option.name]: value });
59 | };
60 |
61 | return (
62 | <>
63 |
66 |
72 | Insert the ID you would like to delete:
73 |
81 |
82 |
83 | {error}
84 |
85 |
86 |
87 | );
88 | };
89 | export default DeleteModal;
90 |
--------------------------------------------------------------------------------
/src/components/pages/RoleApply/Styles/apply.css:
--------------------------------------------------------------------------------
1 | .row {
2 | display: flex;
3 | flex-direction: column;
4 | }
5 |
6 | .ant-space-align-center {
7 | display: flex;
8 | flex-direction: column;
9 | align-items: baseline;
10 | }
11 |
12 | .col1,
13 | .col2 {
14 | min-width: 100%;
15 | display: flex;
16 | justify-content: center;
17 | align-items: center;
18 | margin-top: 0.5%;
19 | padding: 3vh;
20 | }
21 |
22 | .ant-space-item {
23 | justify-content: flex-start;
24 | }
25 |
26 | .card1,
27 | .card2 {
28 | display: flex;
29 | align-items: center;
30 | width: 80vw;
31 | }
32 |
33 | .card-img {
34 | max-height: 70vh;
35 | max-width: 100%;
36 | }
37 |
38 | .title {
39 | font-size: 30px;
40 | font-weight: bold;
41 | display: flex;
42 | justify-content: center;
43 | }
44 |
45 | .description {
46 | font-size: 22px;
47 | display: flex;
48 | align-items: center;
49 | }
50 |
51 | .ant-btn.ant-btn-primary.ant-btn-block.button {
52 | background-color: #003d71;
53 | }
54 |
55 | @media only screen and (min-width: 1440px) {
56 | .card1,
57 | .card2 {
58 | max-width: 100%;
59 | }
60 |
61 | .card-img {
62 | padding: 25px;
63 | }
64 |
65 | .description {
66 | font-size: 1.2rem;
67 | }
68 | }
69 |
70 | @media only screen and (min-width: 1024px) {
71 | .card1,
72 | .card2 {
73 | max-width: 100%;
74 | }
75 |
76 | .card-img {
77 | padding-left: 30px;
78 | }
79 |
80 | .description {
81 | font-size: 1.6rem;
82 | }
83 |
84 | .col1,
85 | .col2 {
86 | display: flex;
87 | align-content: space-between;
88 | }
89 | }
90 |
91 | @media only screen and (max-width: 880px) {
92 | .col1,
93 | .col2 {
94 | display: flex;
95 | }
96 |
97 | .card1,
98 | .card2 {
99 | display: flex;
100 | flex-wrap: wrap;
101 | justify-content: space-around;
102 | }
103 |
104 | .card-img {
105 | max-width: 100%;
106 | align-self: center;
107 | }
108 |
109 | .description {
110 | font-size: 1.5rem;
111 | }
112 | }
113 |
114 | @media only screen and (max-width: 679px) {
115 | .card-img {
116 | padding-top: 0%;
117 | }
118 | }
119 |
120 | @media only screen and (max-width: 554px) {
121 | .card1,
122 | .card2 {
123 | display: flex;
124 | flex-wrap: wrap;
125 | width: 100vw;
126 | }
127 | }
128 |
129 | @media only screen and (max-width: 428px) {
130 | .description {
131 | font-size: 1.1rem;
132 | }
133 |
134 | .title {
135 | font-size: 1.5rem;
136 | }
137 | }
138 |
--------------------------------------------------------------------------------
/src/components/pages/AdminMeetingsDashBoard/ViewAllMeetings/VAMC.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable array-callback-return */
2 | import React, { useState } from 'react';
3 | import 'antd/dist/antd.css';
4 | import { Calendar, Modal, Badge } from 'antd';
5 |
6 | function VAMC(props) {
7 | const { meetingData } = props;
8 | const [isModalVisible, setIsModalVisible] = useState(false);
9 | const [event, setEvent] = useState(null);
10 |
11 | const showModal = value => {
12 | setEvent(value);
13 | setIsModalVisible(true);
14 | };
15 |
16 | const handleOk = () => {
17 | setIsModalVisible(false);
18 | };
19 |
20 | const handleCancel = () => {
21 | setIsModalVisible(false);
22 | };
23 |
24 | function getListData(value, events) {
25 | let listData = [];
26 | let dateValue = value.format('MM/DD/YYYY');
27 | events.map(e => {
28 | if (e.date === dateValue) {
29 | listData.push(e);
30 | }
31 | });
32 | return listData || [];
33 | }
34 |
35 | function dateCellRender(value) {
36 | const listData = getListData(value, meetingData);
37 | return (
38 |
39 | {listData.map((item, i) => (
40 |
41 | showModal(item)}
45 | />
46 |
47 |
48 | ))}
49 |
50 | );
51 | }
52 |
53 | function getMonthData(value) {
54 | if (value.month() === 3) {
55 | return 1394;
56 | }
57 | }
58 |
59 | function monthCellRender(value) {
60 | const num = getMonthData(value);
61 | return num ? (
62 |
63 |
64 | Backlog number
65 |
66 | ) : null;
67 | }
68 |
69 | return (
70 | <>
71 |
76 |
82 |
83 | {event ? `Event Name: ${event.first_name}` : 'Something went wrong.'}
84 |
85 | {event ? `Time: ${event.time}` : 'Something went wrong.'}
86 |
87 | {event
88 | ? `Event Details: ${event.last_name}`
89 | : 'Something went wrong.'}
90 |
91 |
92 |
93 | );
94 | }
95 |
96 | export default VAMC;
97 |
--------------------------------------------------------------------------------
/src/components/pages/MenteeMeetingsDashBoard/ViewAllMeetings/VAMC.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable array-callback-return */
2 | import React, { useState } from 'react';
3 | import 'antd/dist/antd.css';
4 | import { Calendar, Modal, Badge } from 'antd';
5 |
6 | function VAMC(props) {
7 | const { meetingData } = props;
8 | const [isModalVisible, setIsModalVisible] = useState(false);
9 | const [event, setEvent] = useState(null);
10 |
11 | const showModal = value => {
12 | setEvent(value);
13 | setIsModalVisible(true);
14 | };
15 |
16 | const handleOk = () => {
17 | setIsModalVisible(false);
18 | };
19 |
20 | const handleCancel = () => {
21 | setIsModalVisible(false);
22 | };
23 |
24 | function getListData(value, events) {
25 | let listData = [];
26 | let dateValue = value.format('MM/DD/YYYY');
27 | events.map(e => {
28 | if (e.date === dateValue) {
29 | listData.push(e);
30 | }
31 | });
32 | return listData || [];
33 | }
34 |
35 | function dateCellRender(value) {
36 | const listData = getListData(value, meetingData);
37 | return (
38 |
39 | {listData.map((item, i) => (
40 |
41 | showModal(item)}
45 | />
46 |
47 |
48 | ))}
49 |
50 | );
51 | }
52 |
53 | function getMonthData(value) {
54 | if (value.month() === 3) {
55 | return 1394;
56 | }
57 | }
58 |
59 | function monthCellRender(value) {
60 | const num = getMonthData(value);
61 | return num ? (
62 |
63 |
64 | Backlog number
65 |
66 | ) : null;
67 | }
68 |
69 | return (
70 | <>
71 |
76 |
82 |
83 | {event ? `Event Name: ${event.first_name}` : 'Something went wrong.'}
84 |
85 | {event ? `Time: ${event.time}` : 'Something went wrong.'}
86 |
87 | {event
88 | ? `Event Details: ${event.last_name}`
89 | : 'Something went wrong.'}
90 |
91 |
92 |
93 | );
94 | }
95 |
96 | export default VAMC;
97 |
--------------------------------------------------------------------------------
/src/components/pages/MentorMeetingsDashBoard/ViewAllMeetings/VAMC.js:
--------------------------------------------------------------------------------
1 | /* eslint-disable array-callback-return */
2 | import React, { useState } from 'react';
3 | import 'antd/dist/antd.css';
4 | import { Calendar, Modal, Badge } from 'antd';
5 |
6 | function VAMC(props) {
7 | const { meetingData } = props;
8 | const [isModalVisible, setIsModalVisible] = useState(false);
9 | const [event, setEvent] = useState(null);
10 |
11 | const showModal = value => {
12 | setEvent(value);
13 | setIsModalVisible(true);
14 | };
15 |
16 | const handleOk = () => {
17 | setIsModalVisible(false);
18 | };
19 |
20 | const handleCancel = () => {
21 | setIsModalVisible(false);
22 | };
23 |
24 | function getListData(value, events) {
25 | let listData = [];
26 | let dateValue = value.format('MM/DD/YYYY');
27 | events.map(e => {
28 | if (e.date === dateValue) {
29 | listData.push(e);
30 | }
31 | });
32 | return listData || [];
33 | }
34 |
35 | function dateCellRender(value) {
36 | const listData = getListData(value, meetingData);
37 | return (
38 |
39 | {listData.map((item, i) => (
40 |
41 | showModal(item)}
45 | />
46 |
47 |
48 | ))}
49 |
50 | );
51 | }
52 |
53 | function getMonthData(value) {
54 | if (value.month() === 3) {
55 | return 1394;
56 | }
57 | }
58 |
59 | function monthCellRender(value) {
60 | const num = getMonthData(value);
61 | return num ? (
62 |
63 |
64 | Backlog number
65 |
66 | ) : null;
67 | }
68 |
69 | return (
70 | <>
71 |
76 |
82 |
83 | {event ? `Event Name: ${event.first_name}` : 'Something went wrong.'}
84 |
85 | {event ? `Time: ${event.time}` : 'Something went wrong.'}
86 |
87 | {event
88 | ? `Event Details: ${event.last_name}`
89 | : 'Something went wrong.'}
90 |
91 |
92 |
93 | );
94 | }
95 |
96 | export default VAMC;
97 |
--------------------------------------------------------------------------------
/src/components/pages/LandingPage/LandingPage.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {
3 | GithubOutlined,
4 | TwitterOutlined,
5 | InstagramOutlined,
6 | YoutubeOutlined,
7 | LinkedinOutlined,
8 | } from '@ant-design/icons';
9 | import { Button } from 'antd';
10 | import { useAuth0 } from '@auth0/auth0-react';
11 | import './LandingPage.less';
12 | import mentorHelpingMentee from './resources/mentorhelpingmentee.jpg';
13 | import FooterLanding from '../FooterLanding/FooterLanding';
14 |
15 | //Another Pull request is going to need figure out the best way to implement the current application wide header.
16 | //Images acquired from unsplash.com
17 |
18 | const LandingPage = () => {
19 | const { loginWithRedirect, isAuthenticated } = useAuth0();
20 | return (
21 | <>
22 |
23 |
24 |
UNDERDOG DEVS
25 |
26 | We are a group of software engineers helping aspiring developers who
27 | are either formerly incarcerated or from an economically
28 | disadvantaged background.
29 |
30 | {!isAuthenticated /** IF the user is logged in, Hide the button */ ? (
31 | /* Login items: */
32 |
33 |
34 |
Already have an account?
35 |
38 |
39 |
40 | ) : null}
41 | {/*----*/}
42 | {/* Info button */}
43 |
49 |
50 |
51 |
56 |
57 |
60 |
Follow Us On Social Media
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
Mentor Details
{' '}
13 |
25 |
26 | }
27 | width={'80vw'}
28 | visible={userShow}
29 | onCancel={handleCancel}
30 | okText={'Save Changes'}
31 | maskClosable={false}
32 | footer={null}
33 | className="UserModal"
34 | >
35 |
36 |
37 |
Name
38 |
{`${user?.first_name} ${user?.last_name}`}
39 |
40 |
41 |
42 |
Email
43 |
{`${user?.email}`}
44 |
45 |
46 |
47 |
Mentorship Topics
48 |
56 | {user?.tech_stack.length > 0 &&
57 | typeof user?.tech_stack !== String
58 | ? user?.tech_stack.map(el => {
59 | return
{el}
;
60 | })
61 | : user?.tech_stack}
62 |
63 |
64 |
65 |
66 |
67 | What Can Mentor Contribute To Mentee Progress
68 |
69 |
70 | {user?.job_help ? Job Search Help : null}
71 |
72 | {user?.industry_knowledge ? (
73 | Industry Knowledge
74 | ) : null}
75 |
76 |
77 |
78 |
79 |
Anything else
80 |
{user?.other_info}
81 |
82 |
Mentee Details
{' '}
11 |
23 |
24 | }
25 | width={'80vw'}
26 | visible={userShow}
27 | onCancel={handleCancel}
28 | okText={'Save Changes'}
29 | maskClosable={false}
30 | footer={null}
31 | className="UserModal"
32 | >
33 |
34 |
35 |
Name
36 |
{`${user?.first_name} ${user?.last_name}`}
37 |
38 |
39 |
40 |
Email
41 |
{`${user?.email}`}
42 |
43 |
44 |
45 |
City/State/Country
46 |
{`${user?.city} / ${user?.state} / ${user?.country}`}
47 |
48 |
49 |
50 |
Representation
51 |
52 | {user?.formerly_incarcerated ? (
53 | Formerly Incarcerated
54 | ) : null}
55 |
56 | {user?.underrepresented_group ? (
57 | Underrepresented Group
58 | ) : null}
59 |
60 |
61 |
62 |
63 |
Mentorship Topics
64 |
{{user?.tech_stack}}
65 |
66 |
67 |
68 |
Hoping To Gain
69 |
70 | {user?.job_help ? Job Search Help : null}
71 |
72 | {user?.pair_programming ? (
73 | Pair Programming / Coding Practice
74 | ) : null}
75 |
76 |
77 |
78 |
79 |
Hear about UD?
80 |
{user?.referred_by}
81 |
82 |
83 |
84 |
Anything else
85 |
{user?.other_info}
86 |
87 |
{modal}
102 | //
103 | // )}
104 | // >
105 | //
106 | //
107 | //
108 | // );
109 | // }
110 | // }
111 |
112 | // export default Dialog;
113 |
--------------------------------------------------------------------------------
/src/components/common/SkeletonLoading.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { Layout } from 'antd';
3 | import { Skeleton } from 'antd';
4 |
5 | const { Content, Sider } = Layout;
6 |
7 | const SkeletonLoadingComponent = () => {
8 | let siderBackgroundColor = 'rgb(240, 242, 242)';
9 | let layoutSkeleton = 'rgb(247, 247, 247)';
10 | let contentSkeleton = 'white';
11 |
12 | if (localStorage.theme === 'dark') {
13 | siderBackgroundColor = '#262626';
14 | layoutSkeleton = '#000';
15 | contentSkeleton = '#262626';
16 | }
17 |
18 | return (
19 | <>
20 |
21 |
22 |
29 |
30 |
37 |
38 |
45 |
46 |
53 |
54 |
61 |
62 |
69 |
70 |
84 |
85 |
86 |
94 |
95 |
96 |
97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 | );
109 | };
110 |
111 | export default SkeletonLoadingComponent;
112 |
--------------------------------------------------------------------------------
/src/__tests__/AdminDashboard.test.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { cleanup, render, screen } from '@testing-library/react';
3 | import { act } from 'react-dom/test-utils';
4 | import createTestStore from '../__mocks__/CreateTestStore';
5 | import { Provider } from 'react-redux';
6 | import Applications from '../components/pages/Applications/Applications';
7 |
8 | afterEach(cleanup);
9 |
10 | jest.mock('@auth0/auth0-react', () => ({
11 | useAuth0: () => {
12 | return {
13 | authState: {
14 | isAuthenticated: true,
15 | },
16 | authService: {
17 | getUser: jest.fn(() => {
18 | return Promise.resolve({
19 | sub: 'auth0|62e4439b9b1f5f6077c26aab',
20 | name: 'bear001@maildrop.cc',
21 | email: 'bear001@maildrop.cc',
22 | preferred_username: 'bear001@maildrop.cc',
23 | role: 'admin',
24 | });
25 | }),
26 | },
27 | };
28 | },
29 | }));
30 |
31 | describe('Test', () => {
32 | beforeAll(() => {
33 | window.matchMedia =
34 | window.matchMedia ||
35 | function () {
36 | return {
37 | matches: false,
38 | addListener: function () { },
39 | removeListener: function () { },
40 | };
41 | };
42 | });
43 |
44 | test('Sanity Check', () => {
45 | console.log('foo bar');
46 | });
47 | });
48 |
49 | describe('Admin Dashboard Test Suite', () => {
50 | beforeEach(() => {
51 | localStorage.clear();
52 | // creating a mock redux store
53 | const store = createTestStore();
54 | // setting the theme default theme to dark here, if you change it to light here, it will break the darkmode test
55 | // just have to fix the first expect to say the opposite of what you put
56 | localStorage.setItem('theme', 'dark');
57 | });
58 |
59 | test('Asserts that the selected mode is dark', async () => {
60 | act(() => {
61 | render(
62 |
63 |
64 |
65 | );
66 | });
67 | expect(localStorage.theme).toBe('dark');
68 | });
69 |
70 | test('it renders Applications and checks for title', async () => {
71 | act(() => {
72 | render(
73 |
74 |
75 |
76 | );
77 | });
78 |
79 | const dashboardTitles = screen.queryAllByText(/Applications/i, {
80 | selector: 'h2',
81 | });
82 | const dashboardTitle = dashboardTitles.find(
83 | title => title.textContent === 'Applications'
84 | );
85 |
86 | // Assert that dashboardTitles array is not empty
87 | expect(dashboardTitles.length).toBeGreaterThan(0);
88 |
89 | // Assert that the dashboardTitle element is not undefined
90 | expect(dashboardTitle).toBeDefined();
91 |
92 | // Assert that the dashboard title exists and contains the text "My Mentors"
93 | expect(dashboardTitle).toBeTruthy();
94 | expect(dashboardTitle).toHaveTextContent(/Applications/i);
95 |
96 | expect(dashboardTitle).toBeInTheDocument();
97 | expect(dashboardTitle).toBeVisible();
98 | });
99 |
100 | test('Pending toggle is visible', async () => {
101 | act(() => {
102 | render(
103 |
104 |
105 |
106 | );
107 | });
108 |
109 | const pendingToggle = document.getElementsByClassName('pendingToggle')
110 |
111 | expect(pendingToggle).toBeVisible();
112 | expect(pendingToggle).toBeTruthy();
113 | expect(pendingToggle).toBeInTheDocument();
114 | });
115 | });
--------------------------------------------------------------------------------
/src/components/pages/TicketsDashboard/TicketsDashboard.js:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState } from 'react';
2 | import useAxiosWithAuth0 from '../../../hooks/useAxiosWithAuth0';
3 | import { Statistic, Row, Col, Table } from 'antd';
4 | // TODO: update page styling and functionality, see wireframes/NewDesignProposition/AdminWireframes/Dashboard
5 |
6 | const columns = [
7 | {
8 | title: 'Ticket ID',
9 | dataIndex: 'ticketID',
10 | filters: [
11 | {
12 | text: 'Example',
13 | value: 'Example',
14 | },
15 | {
16 | text: 'Jim',
17 | value: 'Jim',
18 | },
19 | {
20 | text: 'Submenu',
21 | value: 'Submenu',
22 | children: [
23 | {
24 | text: 'Green',
25 | value: 'Green',
26 | },
27 | {
28 | text: 'Black',
29 | value: 'Black',
30 | },
31 | ],
32 | },
33 | ],
34 | // specify the condition of filtering result
35 | // here is that finding the name started with `value`
36 | onFilter: (value, record) => record.ticketID.indexOf(value) === 0,
37 | sorter: (a, b) => a.ticketID - b.ticketID,
38 | sortDirections: ['descend'],
39 | },
40 | {
41 | title: 'Message',
42 | dataIndex: 'message',
43 | filters: [
44 | {
45 | text: 'London',
46 | value: 'London',
47 | },
48 | {
49 | text: 'New York',
50 | value: 'New York',
51 | },
52 | ],
53 |
54 | onFilter: (value, record) => record.ticketType.indexOf(value) === 0,
55 | },
56 | {
57 | title: 'Date Submitted',
58 | dataIndex: 'dateSubmitted',
59 | defaultSortOrder: 'descend',
60 | sorter: (a, b) => a.dateSubmitted < b.dateSubmitted,
61 | },
62 | ];
63 |
64 | // TODO: make Ant Design Statistics pull ticket totals from ticket tables
65 | const TicketsDashboard = props => {
66 | const [tickets, setTickets] = useState([]);
67 | const { axiosWithAuth } = useAxiosWithAuth0();
68 |
69 | useEffect(() => {
70 | const getTickets = () => {
71 | axiosWithAuth()
72 | .get('/resource-tickets')
73 | .then(res => {
74 | if (res.data.length > 0) {
75 | setTickets(res.data);
76 | }
77 | });
78 | };
79 | getTickets();
80 | // eslint-disable-next-line react-hooks/exhaustive-deps
81 | }, [axiosWithAuth, setTickets]);
82 |
83 | const data = [];
84 | let escaTickets = [];
85 | if (tickets !== []) {
86 | escaTickets = tickets.filter(x => x.ticket_status === 'approved');
87 | }
88 | // eslint-disable-next-line array-callback-return
89 | tickets.map(t => {
90 | const ticketDetails = {
91 | key: t.ticket_id,
92 | ticketID: t.ticket_id,
93 | message: t.ticket_subject,
94 | };
95 | data.push(ticketDetails);
96 | });
97 | return (
98 |
99 |
Tickets Dashboard
100 |
101 |
102 |
103 |
104 |
105 |
106 |
110 |
111 |
112 |
113 |
114 |
115 |
116 |
119 |
User Detail
{' '}
16 |
28 |
29 | }
30 | width={'80vw'}
31 | visible={userShow}
32 | onCancel={handleCancel}
33 | okText={'Save Changes'}
34 | maskClosable={false}
35 | footer={null}
36 | className="UserModal"
37 | >
38 |
39 |
40 | {`${user.role} / ${
41 | user.numberOfMatches > 0 ? user.numberOfMatches : 0
42 | } ${user.numberOfMatches === 1 ? 'Match' : 'Matches'} `}
43 | {''}
44 |
45 | {' '}
53 |
54 |
55 |
56 |
Name
57 |
userShow(user)}
60 | >{`${user?.first_name} ${user?.last_name}`}
61 |
62 |
63 |
Email
64 |
{`${user?.email}`}
65 |
66 |
67 |
City/State/Country
68 |
{`${user?.city} / ${user?.state} / ${user?.country}`}
69 |
70 |
71 |
Current Company/Position
72 |
{user?.current_company}
73 |
74 |
75 |
Mentorship Topics
76 |
84 | {user?.tech_stack ? (
85 | typeof user.tech_stack === typeof '' ? (
86 |
{user?.tech_stack}
87 | ) : (
88 | user?.tech_stack.map((stack, idx) => {
89 | return
{`${stack}`}
;
90 | })
91 | )
92 | ) : null}
93 |
94 |
95 |
96 |
Commit?
97 |
{user?.commitment ? 'Yes' : 'No'}
98 |
99 |