Created OrgDashboard components
This commit is contained in:
parent
9dd4dc0515
commit
6b63693462
6 changed files with 62 additions and 28 deletions
|
|
@ -25,7 +25,7 @@ function Header() {
|
|||
});
|
||||
|
||||
async function handleLogout() {
|
||||
await axios.post(`http://localhost:3000/api/auth/logout`, {
|
||||
await axios.post(`${process.env.DOMAIN_ROOT}/auth/logout`, {
|
||||
token: Cookies.get('token'),
|
||||
});
|
||||
Cookies.remove('token');
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ function Login() {
|
|||
if (Cookies.get('token')) {
|
||||
async function logout() {
|
||||
await axios
|
||||
.post(`http://localhost:3000/api/auth/logout`, {
|
||||
.post(`${process.env.DOMAIN_ROOT}/auth/logout`, {
|
||||
token: Cookies.get('token'),
|
||||
})
|
||||
.catch((e) => console.log(e));
|
||||
|
|
@ -40,7 +40,7 @@ function Login() {
|
|||
const name = e.target.name;
|
||||
const value = e.target.value;
|
||||
|
||||
setForm(() => {
|
||||
setForm((form) => {
|
||||
return { ...form, [name]: value };
|
||||
});
|
||||
}
|
||||
|
|
@ -57,7 +57,7 @@ function Login() {
|
|||
async function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
await axios
|
||||
.post('http://localhost:3000/api/auth/login', form)
|
||||
.post(`${process.env.DOMAIN_ROOT}/auth/login`, form)
|
||||
.then((response) => {
|
||||
Cookies.set('token', response.data, {
|
||||
expires: form.remember ? 3650 : 1,
|
||||
|
|
|
|||
|
|
@ -1,4 +1,7 @@
|
|||
import React, { useState } from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import axios from 'axios';
|
||||
import Cookies from 'js-cookie';
|
||||
import {
|
||||
Typography,
|
||||
Grid,
|
||||
|
|
@ -12,33 +15,64 @@ import Dashboard from './Dashboard';
|
|||
|
||||
function OrgDashboard() {
|
||||
const [org, setOrg] = useState({
|
||||
orgID: '1234',
|
||||
orgName: 'Org 1',
|
||||
orgID: '',
|
||||
orgName: '',
|
||||
orgOwner: {
|
||||
firstName: 'C4',
|
||||
lastName: 'Patino',
|
||||
email: 'c4patino@gmail.com',
|
||||
firstName: '',
|
||||
lastName: '',
|
||||
email: '',
|
||||
},
|
||||
orgMembers: [],
|
||||
});
|
||||
const [rows, setRows] = useState([]);
|
||||
const { orgID } = useParams();
|
||||
|
||||
const rows = useState([
|
||||
{
|
||||
id: 1,
|
||||
firstName: 'Ceferino',
|
||||
lastName: 'Patino',
|
||||
nickname: 'C4',
|
||||
namePronounciation: '',
|
||||
pronouns: 'he/him',
|
||||
email: 'c4patino@gmail.com',
|
||||
},
|
||||
]);
|
||||
useEffect(() => {
|
||||
async function getData() {
|
||||
await axios
|
||||
.get(
|
||||
`${
|
||||
process.env.DOMAIN_ROOT
|
||||
}/org/${orgID}?token=${Cookies.get('token')}`
|
||||
)
|
||||
.then((response) => {
|
||||
const res = response.data;
|
||||
setOrg(() => {
|
||||
return {
|
||||
orgID: res.orgID,
|
||||
orgName: res.orgName,
|
||||
orgOwner: {
|
||||
firstName: res.orgOwner.firstName,
|
||||
lastName: res.orgOwner.lastName,
|
||||
email: res.orgOwner.email,
|
||||
},
|
||||
orgMembers: res.orgMembers,
|
||||
};
|
||||
});
|
||||
|
||||
const orgMembers = res.orgMembers.map((member, index) => {
|
||||
return {
|
||||
id: index,
|
||||
firstName: member.firstName,
|
||||
lastName: member.lastName,
|
||||
nickname: member.nickname,
|
||||
namePronounciation: member.pronounciation,
|
||||
pronouns: member.pronouns,
|
||||
email: member.email,
|
||||
};
|
||||
});
|
||||
setRows(() => orgMembers);
|
||||
});
|
||||
}
|
||||
|
||||
getData();
|
||||
});
|
||||
|
||||
return (
|
||||
<Dashboard rows={rows}>
|
||||
<Typography variant='h6'>Organizations/{org.orgName}</Typography>
|
||||
<Box sx={{ marginTop: '1vh' }}>
|
||||
<Grid container>
|
||||
<Grid container columns={{ xs: 3, md: 12 }}>
|
||||
<Grid item xs={3}>
|
||||
<Stack spacing={2}>
|
||||
<Typography variant='body1'>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ function Recover() {
|
|||
const name = e.target.name;
|
||||
const value = e.target.value;
|
||||
|
||||
setForm(() => {
|
||||
setForm((form) => {
|
||||
return { ...form, [name]: value };
|
||||
});
|
||||
}
|
||||
|
|
@ -21,7 +21,7 @@ function Recover() {
|
|||
async function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
await axios
|
||||
.get(`http://localhost:3000/api/auth/reset-password?${form.email}`)
|
||||
.get(`${process.env.DOMAIN_ROOT}/auth/reset-password?${form.email}`)
|
||||
.then((response) => {
|
||||
setSuccess(() => response.data);
|
||||
})
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ function Register() {
|
|||
const name = e.target.name;
|
||||
const value = e.target.value;
|
||||
|
||||
setForm(() => {
|
||||
setForm((form) => {
|
||||
return { ...form, [name]: value };
|
||||
});
|
||||
}
|
||||
|
|
@ -33,7 +33,7 @@ function Register() {
|
|||
|
||||
const { confirmPassword, ...filteredForm } = form;
|
||||
await axios
|
||||
.post('http://localhost:3000/api/auth/register', filteredForm)
|
||||
.post(`${process.env.DOMAIN_ROOT}/auth/register`, filteredForm)
|
||||
.then(() => {
|
||||
navigate('/login');
|
||||
})
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ function Reset() {
|
|||
const name = e.target.name;
|
||||
const value = e.target.value;
|
||||
|
||||
setForm(() => {
|
||||
setForm((form) => {
|
||||
return { ...form, [name]: value };
|
||||
});
|
||||
}
|
||||
|
|
@ -24,7 +24,7 @@ function Reset() {
|
|||
async function handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
await axios
|
||||
.patch(`http://localhost:3000/api/auth/reset-password/${id}`, {
|
||||
.patch(`${process.env.DOMAIN_ROOT}/auth/reset-password/${id}`, {
|
||||
password: form.password,
|
||||
})
|
||||
.then(() => {
|
||||
|
|
|
|||
Reference in a new issue