-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathonboarding.tsx
126 lines (113 loc) · 4.38 KB
/
onboarding.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
import * as React from "react";
import Box from "@mui/material/Box";
import Container from "@mui/material/Container";
import Typography from "@mui/material/Typography";
import Head from "next/head";
import { DefaultUser } from "@/backend/functions";
import { getSession } from "next-auth/react";
import { ResumeDataType } from "@/components/User/Dashboard/types";
import { GetServerSideProps } from "next";
import ResumeForm from "@/components/User/Dashboard/ResumeForm";
import { CardContainer, FilledButton } from "@/styles/theme";
import { Icon, Stack, styled } from "@mui/material";
// import Dropzone from "@/components/Dropzone";
import Link from "@/components/Link";
import { BsArrowRightShort } from 'react-icons/bs'
import { InternalLinks } from "@/content/Links";
import Header from "@/layout/Header";
import Onboarding from "@/components/User/Dashboard/onboarding";
export const PaperCard = styled(CardContainer)({
// width: "700px",
marginTop: "40px",
padding: "48px"
})
interface UserDashboardProps {
result: ResumeDataType;
user: DefaultUser;
}
export default function SignUp({ result, user }: UserDashboardProps) {
React.useEffect(() => {
const newuser = user;
newuser.name = result.info.name;
newuser.profileImage = result.info.profileImage;
newuser.username = result.username;
localStorage.setItem("user", JSON.stringify(newuser));
})
return (
<>
<Head>
<title>Profile | COMETLABS</title>
</Head>
<Header noLink user={user} />
<Container component="main" sx={{ mt: 5 }}>
<Stack direction="row" justifyContent="space-between" alignItems="center">
<div>
<Typography variant="TitleLarge" color="onsurfacevariant.main" sx={{ mr: 1 }}>
Hi, {user.name?.split(' ').slice(0, 1).join(' ')}!
</Typography>
<Typography variant="HeadlineSmall">Let's build your comet profile together!</Typography>
</div>
<Link href={InternalLinks.DEV_DASHBOARD + user.username} sx={{ display: 'flex', alignItems: 'flex-end' }}>
<Typography variant="LabelLarge">I'll do it later</Typography>
<Icon><BsArrowRightShort /></Icon>
</Link>
</Stack>
<Box sx={{ width: { xs: "90%", md: "60%", lg: "750px" }, margin: "auto" }}>
<ResumeForm {...result}>
<Onboarding />
<FilledButton
type="submit" endIcon={<BsArrowRightShort />} sx={{ mt: "48px", mb: "108px", float: "right" }}><Typography variant="LabelLarge">Next</Typography>
</FilledButton>
</ResumeForm>
</Box>
</Container>
</>
);
}
export const getServerSideProps: GetServerSideProps = async (context) => {
const session = await getSession(context);
if (!!session) {
const user: DefaultUser = session.user as DefaultUser;
try {
const accessToken = "Token " + user.accessToken;
let res = await fetch(
process.env.NEXT_PUBLIC_API_URL + "/user/getProfile",
{
method: "GET",
headers: {
"Content-Type": "application/json;charset=utf-8",
Authorization: accessToken,
},
}
);
if (res.ok) {
const result = await res.json();
if (!result.error) {
delete result.email;
return {
props: { user, result },
};
} else {
console.log(result.error);
}
} else if (res.status == 401) {
return {
redirect: {
permanent: false,
destination: "/logout",
}
}
} else {
throw new Error("ERROR");
}
} catch (error) {
console.log(error);
}
}
return {
redirect: {
permanent: false,
destination: "/signin",
},
};
};