jeffemmett
/
postiz
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: github authentication

This commit is contained in:
Nevo David 2024-03-16 19:06:52 +07:00
parent 236fc7fbf7
commit 4661ca4f2a
10 changed files with 268 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
apps/backend/src/api/routes/auth.controller.ts
View File

@ -1,4 +1,4 @@
import { Body, Controller, Post, Req, Res } from '@nestjs/common';
import { Body, Controller, Get, Param, Post, Req, Res } from '@nestjs/common';
import { Response, Request } from 'express';
import { CreateOrgUserDto } from '@gitroom/nestjs-libraries/dtos/auth/create.org.user.dto';
@ -6,8 +6,8 @@ import { LoginUserDto } from '@gitroom/nestjs-libraries/dtos/auth/login.user.dto
import { AuthService } from '@gitroom/backend/services/auth/auth.service';
import { ForgotReturnPasswordDto } from '@gitroom/nestjs-libraries/dtos/auth/forgot-return.password.dto';
import { ForgotPasswordDto } from '@gitroom/nestjs-libraries/dtos/auth/forgot.password.dto';
import {removeSubdomain} from "@gitroom/helpers/subdomain/subdomain.management";
import {ApiTags} from "@nestjs/swagger";
import { removeSubdomain } from '@gitroom/helpers/subdomain/subdomain.management';
import { ApiTags } from '@nestjs/swagger';
@ApiTags('Auth')
@Controller('/auth')
@ -31,7 +31,8 @@ export class AuthController {
);
response.cookie('auth', jwt, {
domain: '.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
domain:
'.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
secure: true,
httpOnly: true,
sameSite: 'none',
@ -40,7 +41,8 @@ export class AuthController {
if (typeof addedOrg !== 'boolean' && addedOrg?.organizationId) {
response.cookie('showorg', addedOrg.organizationId, {
domain: '.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
domain:
'.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
secure: true,
httpOnly: true,
sameSite: 'none',
@ -75,7 +77,8 @@ export class AuthController {
);
response.cookie('auth', jwt, {
domain: '.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
domain:
'.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
secure: true,
httpOnly: true,
sameSite: 'none',
@ -84,7 +87,8 @@ export class AuthController {
if (typeof addedOrg !== 'boolean' && addedOrg?.organizationId) {
response.cookie('showorg', addedOrg.organizationId, {
domain: '.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
domain:
'.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
secure: true,
httpOnly: true,
sameSite: 'none',
@ -122,4 +126,36 @@ export class AuthController {
reset: !!reset,
};
}
@Get('/oauth/:provider')
async oauthLink(@Param('provider') provider: string) {
return this._authService.oauthLink(provider);
}
@Post('/oauth/:provider/exists')
async oauthExists(
@Body('code') code: string,
@Param('provider') provider: string,
@Res({ passthrough: true }) response: Response
) {
const { jwt, token } = await this._authService.checkExists(provider, code);
if (token) {
return response.json({ token });
}
response.cookie('auth', jwt, {
domain:
'.' + new URL(removeSubdomain(process.env.FRONTEND_URL!)).hostname,
secure: true,
httpOnly: true,
sameSite: 'none',
expires: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365),
});
response.header('reload', 'true');
response.status(200).json({
login: true,
});
}
}

40
apps/backend/src/services/auth/auth.service.ts
View File

@ -9,7 +9,7 @@ import { ProvidersFactory } from '@gitroom/backend/services/auth/providers/provi
import dayjs from 'dayjs';
import { NewsletterService } from '@gitroom/nestjs-libraries/services/newsletter.service';
import { NotificationService } from '@gitroom/nestjs-libraries/database/prisma/notifications/notification.service';
import {ForgotReturnPasswordDto} from "@gitroom/nestjs-libraries/dtos/auth/forgot-return.password.dto";
import { ForgotReturnPasswordDto } from '@gitroom/nestjs-libraries/dtos/auth/forgot-return.password.dto';
@Injectable()
export class AuthService {
@ -96,11 +96,15 @@ export class AuthService {
) {
const providerInstance = ProvidersFactory.loadProvider(provider);
const providerUser = await providerInstance.getUser(body.providerToken);
if (!providerUser) {
throw new Error('Invalid provider token');
}
const user = await this._userService.getUserByProvider(providerUser.id, provider);
const user = await this._userService.getUserByProvider(
providerUser.id,
provider
);
if (user) {
return user;
}
@ -137,7 +141,10 @@ export class AuthService {
}
forgotReturn(body: ForgotReturnPasswordDto) {
const user = AuthChecker.verifyJWT(body.token) as {id: string, expires: string};
const user = AuthChecker.verifyJWT(body.token) as {
id: string;
expires: string;
};
if (dayjs(user.expires).isBefore(dayjs())) {
return false;
}
@ -145,6 +152,33 @@ export class AuthService {
return this._userService.updatePassword(user.id, body.password);
}
oauthLink(provider: string) {
const providerInstance = ProvidersFactory.loadProvider(
provider as Provider
);
return providerInstance.generateLink();
}
async checkExists(provider: string, code: string) {
const providerInstance = ProvidersFactory.loadProvider(
provider as Provider
);
const token = await providerInstance.getToken(code);
const user = await providerInstance.getUser(token);
if (!user) {
throw new Error('Invalid user');
}
const checkExists = await this._userService.getUserByProvider(
user.id,
provider as Provider
);
if (checkExists) {
return { jwt: await this.jwt(checkExists) };
}
return { token };
}
private async jwt(user: User) {
return AuthChecker.signJWT(user);
}

2
apps/backend/src/services/auth/providers.interface.ts
View File

@ -1,3 +1,5 @@
export interface ProvidersInterface {
generateLink(): string;
getToken(code: string): Promise<string>;
getUser(providerToken: string): Promise<{email: string, id: string}> | false;
}

65
apps/backend/src/services/auth/providers/github.provider.ts
View File

@ -1,15 +1,54 @@
import {ProvidersInterface} from "@gitroom/backend/services/auth/providers.interface";
import { ProvidersInterface } from '@gitroom/backend/services/auth/providers.interface';
export class GithubProvider implements ProvidersInterface {
async getUser(providerToken: string): Promise<{email: string, id: string}> {
const data = await (await fetch('https://api.github.com/user', {
headers: {
Authorization: `token ${providerToken}`
}
})).json();
return {
email: data.email,
id: data.id,
};
}
}
generateLink(): string {
return `https://github.com/login/oauth/authorize?client_id=${
process.env.GITHUB_CLIENT_ID
}&scope=user:email&redirect_uri=${encodeURIComponent(
`${process.env.FRONTEND_URL}/settings?provider=github`
)}`;
}
async getToken(code: string): Promise<string> {
const { access_token } = await (
await fetch('https://github.com/login/oauth/access_token', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Accept: 'application/json',
},
body: JSON.stringify({
client_id: process.env.GITHUB_CLIENT_ID,
client_secret: process.env.GITHUB_CLIENT_SECRET,
code,
redirect_uri: `${process.env.FRONTEND_URL}/settings`,
}),
})
).json();
return access_token;
}
async getUser(access_token: string): Promise<{ email: string; id: string }> {
const data = await (
await fetch('https://api.github.com/user', {
headers: {
Authorization: `token ${access_token}`,
},
})
).json();
const [{ email }] = await (
await fetch('https://api.github.com/user/emails', {
headers: {
Authorization: `token ${access_token}`,
},
})
).json();
return {
email: email,
id: String(data.id),
};
}
}

33
apps/frontend/src/app/auth/providers/github.provider.tsx Normal file
View File

@ -0,0 +1,33 @@
import { useCallback } from 'react';
import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
export const GithubProvider = () => {
const fetch = useFetch();
const gotoLogin = useCallback(async () => {
const link = await (await fetch('/auth/oauth/GITHUB')).text();
window.location.href = link;
}, []);
return (
<div
onClick={gotoLogin}
className="cursor-pointer bg-white h-[44px] rounded-[4px] flex justify-center items-center text-[#121A2D] font-['Inter'] gap-[4px]"
>
<div>
<svg
xmlns="http://www.w3.org/2000/svg"
width="21"
height="20"
viewBox="0 0 21 20"
fill="none"
>
<path
d="M16.7742 5.91251C16.9653 5.29626 17.0265 4.64711 16.9542 4.00599C16.8819 3.36487 16.6775 2.7457 16.3539 2.18751C16.299 2.09248 16.2201 2.01357 16.1251 1.95871C16.03 1.90385 15.9222 1.87499 15.8125 1.87501C15.0845 1.87349 14.3663 2.04225 13.7151 2.36781C13.064 2.69337 12.4981 3.16671 12.0625 3.75001H10.1875C9.75193 3.16671 9.18598 2.69337 8.53485 2.36781C7.88372 2.04225 7.16548 1.87349 6.4375 1.87501C6.32777 1.87499 6.21996 1.90385 6.12492 1.95871C6.02988 2.01357 5.95096 2.09248 5.89609 2.18751C5.57254 2.7457 5.36815 3.36487 5.2958 4.00599C5.22346 4.64711 5.28474 5.29626 5.47578 5.91251C5.08963 6.58651 4.88278 7.34827 4.875 8.12501V8.75001C4.87632 9.80751 5.26021 10.8288 5.9558 11.6254C6.65139 12.4219 7.61169 12.9399 8.65938 13.0836C8.23173 13.6308 7.9996 14.3055 8 15V15.625H6.125C5.62772 15.625 5.15081 15.4275 4.79917 15.0758C4.44754 14.7242 4.25 14.2473 4.25 13.75C4.25 13.3396 4.16917 12.9333 4.01212 12.5541C3.85508 12.175 3.62489 11.8305 3.33471 11.5403C3.04453 11.2501 2.70003 11.0199 2.32089 10.8629C1.94174 10.7058 1.53538 10.625 1.125 10.625C0.95924 10.625 0.800269 10.6909 0.683058 10.8081C0.565848 10.9253 0.5 11.0842 0.5 11.25C0.5 11.4158 0.565848 11.5747 0.683058 11.692C0.800269 11.8092 0.95924 11.875 1.125 11.875C1.62228 11.875 2.09919 12.0726 2.45083 12.4242C2.80246 12.7758 3 13.2527 3 13.75C3 14.5788 3.32924 15.3737 3.91529 15.9597C4.50134 16.5458 5.2962 16.875 6.125 16.875H8V18.125C8 18.2908 8.06585 18.4497 8.18306 18.567C8.30027 18.6842 8.45924 18.75 8.625 18.75C8.79076 18.75 8.94973 18.6842 9.06694 18.567C9.18415 18.4497 9.25 18.2908 9.25 18.125V15C9.25 14.5027 9.44754 14.0258 9.79917 13.6742C10.1508 13.3226 10.6277 13.125 11.125 13.125C11.6223 13.125 12.0992 13.3226 12.4508 13.6742C12.8025 14.0258 13 14.5027 13 15V18.125C13 18.2908 13.0658 18.4497 13.1831 18.567C13.3003 18.6842 13.4592 18.75 13.625 18.75C13.7908 18.75 13.9497 18.6842 14.0669 18.567C14.1842 18.4497 14.25 18.2908 14.25 18.125V15C14.2504 14.3055 14.0183 13.6308 13.5906 13.0836C14.6383 12.9399 15.5986 12.4219 16.2942 11.6254C16.9898 10.8288 17.3737 9.80751 17.375 8.75001V8.12501C17.3672 7.34827 17.1604 6.58651 16.7742 5.91251ZM16.125 8.75001C16.125 9.57881 15.7958 10.3737 15.2097 10.9597C14.6237 11.5458 13.8288 11.875 13 11.875H9.25C8.4212 11.875 7.62634 11.5458 7.04029 10.9597C6.45424 10.3737 6.125 9.57881 6.125 8.75001V8.12501C6.13266 7.50003 6.31978 6.89042 6.66406 6.36876C6.72824 6.28417 6.76981 6.18461 6.78485 6.0795C6.79988 5.97439 6.78789 5.86717 6.75 5.76798C6.5872 5.34813 6.50886 4.90029 6.51945 4.45011C6.53004 3.99993 6.62936 3.55627 6.81172 3.14454C7.32322 3.19957 7.81577 3.36901 8.25287 3.6403C8.68997 3.91159 9.06041 4.27778 9.33672 4.71173C9.39303 4.79978 9.47051 4.8723 9.56209 4.92267C9.65368 4.97303 9.75642 4.99962 9.86094 5.00001H12.3883C12.4932 5.00001 12.5964 4.97361 12.6884 4.92323C12.7805 4.87285 12.8583 4.80011 12.9148 4.71173C13.1911 4.27775 13.5615 3.91153 13.9986 3.64023C14.4358 3.36893 14.9283 3.19951 15.4398 3.14454C15.622 3.55637 15.721 4.00009 15.7313 4.45027C15.7417 4.90044 15.663 5.34823 15.5 5.76798C15.4622 5.86622 15.4496 5.97235 15.4632 6.07672C15.4769 6.18109 15.5164 6.2804 15.5781 6.36563C15.9258 6.8873 16.1157 7.49816 16.125 8.12501V8.75001Z"
fill="#121A2D"
/>
</svg>
</div>
<div>Sign in with GitHub</div>
</div>
);
};

12
apps/frontend/src/components/auth/login.tsx
View File

@ -8,6 +8,7 @@ import { Input } from '@gitroom/react/form/input';
import { useMemo, useState } from 'react';
import { classValidatorResolver } from '@hookform/resolvers/class-validator';
import { LoginUserDto } from '@gitroom/nestjs-libraries/dtos/auth/login.user.dto';
import { GithubProvider } from '@gitroom/frontend/app/auth/providers/github.provider';
type Inputs = {
email: string;
@ -53,10 +54,17 @@ export function Login() {
<form onSubmit={form.handleSubmit(onSubmit)}>
<div>
<h1 className="text-3xl font-bold text-left mb-4 cursor-pointer">
Create An Account
Sign In
</h1>
</div>
<div className="space-y-4 text-white">
<GithubProvider />
<div className="h-[20px] mb-[24px] mt-[24px] relative">
<div className="absolute w-full h-[1px] bg-[#28344F] top-[50%] -translate-y-[50%]" />
<div className="absolute z-[1] font-['Inter'] justify-center items-center w-full left-0 top-0 flex">
<div className="bg-[#0a0a0a] px-[16px]">OR</div>
</div>
</div>
<div className="text-white">
<Input
label="Email"
{...form.register('email')}

108
apps/frontend/src/components/auth/register.tsx
View File

@ -5,20 +5,73 @@ import { useFetch } from '@gitroom/helpers/utils/custom.fetch';
import Link from 'next/link';
import { Button } from '@gitroom/react/form/button';
import { Input } from '@gitroom/react/form/input';
import { useMemo, useState } from 'react';
import { useCallback, useEffect, useMemo, useState } from 'react';
import { classValidatorResolver } from '@hookform/resolvers/class-validator';
import { CreateOrgUserDto } from '@gitroom/nestjs-libraries/dtos/auth/create.org.user.dto';
import { GithubProvider } from '@gitroom/frontend/app/auth/providers/github.provider';
import { useSearchParams } from 'next/navigation';
import { LoadingComponent } from '@gitroom/frontend/components/layout/loading';
type Inputs = {
email: string;
password: string;
company: string;
providerToken: '';
provider: 'LOCAL';
providerToken: string;
provider: string;
};
export function Register() {
const getQuery = useSearchParams();
const fetch = useFetch();
const [provider] = useState(getQuery?.get('provider')?.toUpperCase());
const [code, setCode] = useState(getQuery?.get('code') || '');
const [show, setShow] = useState(false);
useEffect(() => {
if (provider && code) {
load();
}
}, []);
const load = useCallback(async () => {
const { token } = await (
await fetch(`/auth/oauth/${provider?.toUpperCase() || 'LOCAL'}/exists`, {
method: 'POST',
body: JSON.stringify({ code }),
})
).json();
if (token) {
setCode(token);
setShow(true);
}
}, [provider, code]);
if (!code && !provider) {
return <RegisterAfter token="" provider="LOCAL" />;
}
if (!show) {
return <LoadingComponent />;
}
return <RegisterAfter token={code} provider={provider?.toUpperCase() || 'LOCAL'} />;
}
export function RegisterAfter({
token,
provider,
}: {
token: string;
provider: string;
}) {
const [loading, setLoading] = useState(false);
const getQuery = useSearchParams();
const isAfterProvider = useMemo(() => {
return !!token && !!provider;
}, [token, provider]);
const resolver = useMemo(() => {
return classValidatorResolver(CreateOrgUserDto);
}, []);
@ -26,8 +79,8 @@ export function Register() {
const form = useForm<Inputs>({
resolver,
defaultValues: {
providerToken: '',
provider: 'LOCAL',
providerToken: token,
provider: provider,
},
});
@ -37,7 +90,7 @@ export function Register() {
setLoading(true);
const register = await fetchData('/auth/register', {
method: 'POST',
body: JSON.stringify({ ...data, provider: 'LOCAL' }),
body: JSON.stringify({ ...data }),
});
if (register.status === 400) {
form.setError('email', {
@ -53,23 +106,36 @@ export function Register() {
<form onSubmit={form.handleSubmit(onSubmit)}>
<div>
<h1 className="text-3xl font-bold text-left mb-4 cursor-pointer">
Create An Account
Sign Up
</h1>
</div>
<div className="space-y-4 text-white">
<Input
label="Email"
{...form.register('email')}
type="email"
placeholder="Email Addres"
/>
<Input
label="Password"
{...form.register('password')}
autoComplete="off"
type="password"
placeholder="Password"
/>
{!isAfterProvider && <GithubProvider />}
{!isAfterProvider && (
<div className="h-[20px] mb-[24px] mt-[24px] relative">
<div className="absolute w-full h-[1px] bg-[#28344F] top-[50%] -translate-y-[50%]" />
<div className="absolute z-[1] font-['Inter'] justify-center items-center w-full left-0 top-0 flex">
<div className="bg-[#0a0a0a] px-[16px]">OR</div>
</div>
</div>
)}
<div className="text-white">
{!isAfterProvider && (
<>
<Input
label="Email"
{...form.register('email')}
type="email"
placeholder="Email Addres"
/>
<Input
label="Password"
{...form.register('password')}
autoComplete="off"
type="password"
placeholder="Password"
/>
</>
)}
<Input
label="Company"
{...form.register('company')}

1
apps/frontend/src/components/launches/calendar.tsx
View File

@ -122,7 +122,6 @@ export const Calendar = () => {
.hour(+hour.split(':')[0] - 1)
.minute(0)}
/>
{console.log(currentWeek)}
{['00', '10', '20', '30', '40', '50'].map((num) => (
<CalendarColumn
key={day + hour + num + currentWeek + currentYear}

7
apps/frontend/src/middleware.ts
View File

@ -7,7 +7,6 @@ import { removeSubdomain } from '@gitroom/helpers/subdomain/subdomain.management
export async function middleware(request: NextRequest) {
const nextUrl = request.nextUrl;
const authCookie = request.cookies.get('auth');
const showorg = request.cookies.get('showorg');
// If the URL is logout, delete the cookie and redirect to login
if (nextUrl.href.indexOf('/auth/logout') > -1) {
@ -27,15 +26,15 @@ export async function middleware(request: NextRequest) {
}
const org = nextUrl.searchParams.get('org');
const orgUrl = org ? '?org=' + org : '';
const url = new URL(nextUrl).search;
if (nextUrl.href.indexOf('/auth') === -1 && !authCookie) {
return NextResponse.redirect(new URL(`/auth${orgUrl}`, nextUrl.href));
return NextResponse.redirect(new URL(`/auth${url}`, nextUrl.href));
}
// If the url is /auth and the cookie exists, redirect to /
if (nextUrl.href.indexOf('/auth') > -1 && authCookie) {
return NextResponse.redirect(new URL(`/${orgUrl}`, nextUrl.href));
return NextResponse.redirect(new URL(`/${url}`, nextUrl.href));
}
if (nextUrl.href.indexOf('/auth') > -1 && !authCookie) {

1
libraries/nestjs-libraries/src/dtos/auth/create.org.user.dto.ts
View File

@ -19,6 +19,7 @@ export class CreateOrgUserDto {
@IsEmail()
@IsDefined()
@ValidateIf(o => !o.providerToken)
email: string;
@IsString()