17 | >(({ className, sideOffset = 4, ...props }, ref) => (
18 |
7 |
8 | Ult
10 |
11 |
12 |
13 |
14 |
18 |
19 | The Ultimate Stack for Modern Frameworks
20 |
21 |
22 |
35 | );
36 | };
37 |
38 | export default Header;
39 |
--------------------------------------------------------------------------------
/apps/web/public/next.svg:
--------------------------------------------------------------------------------
1 | (
8 | Component: ComponentType
,
9 | allowedRoles: string[],
10 | failedRedirectPath = "/login"
11 | ): React.FC
{
12 | const WithAuthComponent: React.FC
= (props) => {
13 | const { currentUser, isAuthenticating } = useUserContext();
14 | const router = useRouter();
15 |
16 | useEffect(() => {
17 | if (!isAuthenticating) {
18 | // If there's no user or the user's roles don't include the required roles, redirect them.
19 | const isAuthorized = currentUser?.roles?.some((role) =>
20 | allowedRoles.includes(role.name)
21 | );
22 | if (!currentUser || !isAuthorized) {
23 | router.push(failedRedirectPath);
24 | return;
25 | }
26 | }
27 | }, [currentUser, isAuthenticating, router]);
28 |
29 | // Render a loading state or null until authentication is determined.
30 | if (isAuthenticating || !currentUser) {
31 | return <>;
32 | }
33 |
34 | // Spread the props to the component when rendering.
35 | return ,
30 | VariantProps {}
31 |
32 | function Badge({ className, variant, ...props }: BadgeProps) {
33 | return (
34 |
35 | )
36 | }
37 |
38 | export { Badge, badgeVariants }
--------------------------------------------------------------------------------
/apps/server/src/email/email.module.ts:
--------------------------------------------------------------------------------
1 | // email.module.ts
2 |
3 | import { MailerModule } from '@nestjs-modules/mailer';
4 | import { EjsAdapter } from '@nestjs-modules/mailer/dist/adapters/ejs.adapter';
5 | import { Global, Module } from '@nestjs/common';
6 | import { ConfigService } from '@server/config/config.service';
7 | import { join } from 'path';
8 | import { EmailService } from './email.service';
9 |
10 | @Global()
11 | @Module({
12 | imports: [
13 | MailerModule.forRootAsync({
14 | useFactory: async (configService: ConfigService) => ({
15 | transport: {
16 | host: configService.get('MAIL_SMTP_HOST'),
17 | port: configService.get('MAIL_SMTP_PORT'),
18 | secure: configService.get('MAIL_SMTP_SECURE'),
19 | auth: {
20 | user: configService.get('MAIL_SMTP_USERNAME'),
21 | pass: configService.get('MAIL_SMTP_PASSWORD'),
22 | },
23 | },
24 | defaults: {
25 | from: `${configService.get('MAIL_DEFAULT_FROM')}`,
26 | },
27 | template: {
28 | dir: join(__dirname, 'templates'),
29 | adapter: new EjsAdapter(),
30 | options: {
31 | strict: false,
32 | },
33 | },
34 | }),
35 | inject: [ConfigService],
36 | }),
37 | ],
38 | providers: [EmailService, ConfigService],
39 | exports: [EmailService, ConfigService],
40 | })
41 | export class EmailModule {}
42 |
--------------------------------------------------------------------------------
/scripts/configure-s3-cors.js:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env node
2 |
3 | const { S3Client, PutBucketCorsCommand } = require('@aws-sdk/client-s3');
4 | require('dotenv').config({ path: './apps/server/.env.development' });
5 |
6 | const s3Client = new S3Client({
7 | region: process.env.AWS_REGION || 'us-west-2',
8 | credentials: {
9 | accessKeyId: process.env.AWS_ACCESS_KEY_ID,
10 | secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
11 | },
12 | endpoint: process.env.AWS_ENDPOINT, // For local testing with LocalStack
13 | });
14 |
15 | const corsConfiguration = {
16 | CORSRules: [
17 | {
18 | AllowedHeaders: ['*'],
19 | AllowedMethods: ['GET', 'PUT', 'POST', 'DELETE', 'HEAD'],
20 | AllowedOrigins: [
21 | 'http://localhost:3000',
22 | 'http://localhost:3001',
23 | 'http://localhost:3002',
24 | 'https://your-production-domain.com', // Add your production domain
25 | ],
26 | ExposeHeaders: ['ETag'],
27 | MaxAgeSeconds: 3600,
28 | },
29 | ],
30 | };
31 |
32 | async function configureCors() {
33 | try {
34 | const command = new PutBucketCorsCommand({
35 | Bucket: process.env.AWS_S3_BUCKET || 'ult-s3',
36 | CORSConfiguration: corsConfiguration,
37 | });
38 |
39 | await s3Client.send(command);
40 | console.log('✅ CORS configuration applied successfully to S3 bucket:', process.env.AWS_S3_BUCKET);
41 | } catch (error) {
42 | console.error('❌ Error configuring CORS:', error);
43 | }
44 | }
45 |
46 | configureCors();
--------------------------------------------------------------------------------
/apps/shared/transformer.ts:
--------------------------------------------------------------------------------
1 | export const transformer = {
2 | serialize: (value: any) => {
3 | // Recursively search for Date objects to convert to strings
4 | const serializeDate = (obj: any): any => {
5 | if (obj instanceof Date) {
6 | return obj.toISOString();
7 | } else if (Array.isArray(obj)) {
8 | return obj.map(serializeDate);
9 | } else if (typeof obj === "object" && obj !== null) {
10 | const serializedObj: Record = {};
11 | for (const key in obj) {
12 | serializedObj[key] = serializeDate(obj[key]);
13 | }
14 | return serializedObj;
15 | }
16 | return obj;
17 | };
18 |
19 | return serializeDate(value);
20 | },
21 | deserialize: (value: any) => {
22 | // Recursively search for stringified dates to convert back to Date objects
23 | const deserializeDate = (obj: any): any => {
24 | if (typeof obj === "string") {
25 | const date = Date.parse(obj);
26 | if (!isNaN(date)) {
27 | return new Date(date);
28 | }
29 | } else if (Array.isArray(obj)) {
30 | return obj.map(deserializeDate);
31 | } else if (typeof obj === "object" && obj !== null) {
32 | const deserializedObj: Record = {};
33 | for (const key in obj) {
34 | deserializedObj[key] = deserializeDate(obj[key]);
35 | }
36 | return deserializedObj;
37 | }
38 | return obj;
39 | };
40 |
41 | return deserializeDate(value);
42 | },
43 | };
44 |
--------------------------------------------------------------------------------
/apps/server/src/trpc/trpc.router.ts:
--------------------------------------------------------------------------------
1 | import { INestApplication, Injectable } from '@nestjs/common';
2 | import { CategoryRouter } from '@server/category/category.router';
3 | import { PostRouter } from '@server/post/post.router';
4 | import { RoleRouter } from '@server/role/role.router';
5 | import { TrpcService, createContext } from '@server/trpc/trpc.service';
6 | import { UploadRouter } from '@server/upload/upload.router';
7 | import { UserRouter } from '@server/user/user.router';
8 | import * as trpcExpress from '@trpc/server/adapters/express';
9 |
10 | @Injectable()
11 | export class TrpcRouter {
12 | public readonly appRouter;
13 |
14 | constructor(
15 | private readonly trpcService: TrpcService,
16 | private readonly userRouter: UserRouter,
17 | private readonly postRouter: PostRouter,
18 | private readonly roleRouter: RoleRouter,
19 | private readonly categoryRouter: CategoryRouter,
20 | private readonly uploadRouter: UploadRouter,
21 | ) {
22 | this.appRouter = this.trpcService.trpc.router({
23 | ...this.userRouter.apply(),
24 | ...this.postRouter.apply(),
25 | ...this.roleRouter.apply(),
26 | ...this.categoryRouter.apply(),
27 | ...this.uploadRouter.apply(),
28 | });
29 | }
30 |
31 | async applyMiddleware(app: INestApplication) {
32 | app.use(
33 | `/trpc`,
34 | trpcExpress.createExpressMiddleware({
35 | router: this.appRouter,
36 | createContext,
37 | }),
38 | );
39 | }
40 | }
41 |
42 | export type AppRouter = TrpcRouter['appRouter'];
43 |
--------------------------------------------------------------------------------
/apps/server/src/auth/google.strategy.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@nestjs/common';
2 | import { PassportStrategy } from '@nestjs/passport';
3 | import { Strategy, VerifyCallback } from 'passport-google-oauth20';
4 | import { AuthService } from './auth.service';
5 | import { ConfigService } from '@nestjs/config';
6 |
7 | @Injectable()
8 | export class GoogleStrategy extends PassportStrategy(Strategy, 'google') {
9 | constructor(
10 | private readonly authService: AuthService,
11 | private readonly configService: ConfigService,
12 | ) {
13 | super({
14 | clientID: configService.get('GOOGLE_CLIENT_ID') || '',
15 | clientSecret: configService.get('GOOGLE_CLIENT_SECRET') || '',
16 | callbackURL: configService.get('GOOGLE_CALLBACK_URL') || '',
17 | scope: ['email', 'profile'],
18 | });
19 | }
20 |
21 | // async validate(
22 | // accessToken: string,
23 | // refreshToken: string,
24 | // profile: any,
25 | // done: VerifyCallback,
26 | // ): Promise {
27 | // const user = await this.authService.validateUser(profile);
28 | // done(null, user);
29 | // }
30 |
31 | async validate(
32 | accessToken: string,
33 | refreshToken: string,
34 | profile: any,
35 | ): Promise {
36 | const { name, emails, photos } = profile;
37 | const user = {
38 | email: emails[0].value,
39 | firstName: name.givenName,
40 | lastName: name.familyName,
41 | picture: photos[0].value,
42 | accessToken,
43 | };
44 | return user;
45 | }
46 | }
47 |
--------------------------------------------------------------------------------
/apps/web/components/ui/avatar.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as AvatarPrimitive from "@radix-ui/react-avatar"
5 |
6 | import { cn } from "@web/lib/utils"
7 |
8 | const Avatar = React.forwardRef<
9 | React.ElementRef,
10 | React.ComponentPropsWithoutRef
11 | >(({ className, ...props }, ref) => (
12 | ,
25 | React.ComponentPropsWithoutRef
26 | >(({ className, ...props }, ref) => (
27 | ,
37 | React.ComponentPropsWithoutRef
38 | >(({ className, ...props }, ref) => (
39 |
27 |
No recent users
28 |
34 | {usersWithRevenue.map((user) => (
35 |
36 |
37 |
39 | {user.firstName?.[0]?.toUpperCase()}
40 | {user.lastName?.[0]?.toUpperCase()}
41 |
42 |
43 |
44 |
45 | {user.firstName} {user.lastName}
46 |
47 |
{user.email}
48 |
49 |
+${user.revenue.toLocaleString()}
50 |
51 | ))}
52 |
31 |
32 |
39 |
40 |
41 | Please wait while we verify your account
42 |
43 |
44 |
45 |
();
11 | const authService = mock();
12 | const emailService = createMock();
13 |
14 | const service = new UserService(prismaService, authService, emailService);
15 |
16 | describe('login', () => {
17 | it('should throw NotFoundException if user does not exist', async () => {
18 | prismaService.user.findFirst.mockResolvedValueOnce(null);
19 | await expect(
20 | service.login({ email: 'test', password: 'test' }),
21 | ).rejects.toThrowError('Invalid login');
22 | });
23 |
24 | it('should throw UnauthorizedException if password is invalid', async () => {
25 | prismaService.user.findFirst.mockResolvedValueOnce(createMock());
26 | authService.verifyPassword.mockResolvedValueOnce(false);
27 | await expect(
28 | service.login({ email: 'test', password: 'test' }),
29 | ).rejects.toThrowError('Invalid login');
30 | });
31 |
32 | it('should return user if login is successful', async () => {
33 | const user = createMock();
34 | prismaService.user.findFirst.mockResolvedValueOnce(user);
35 | authService.verifyPassword.mockResolvedValueOnce(true);
36 |
37 | const res = await service.login({ email: 'test', password: 'test' });
38 |
39 | expect(res).toEqual(expect.objectContaining({ user }));
40 | });
41 | });
42 | });
43 |
--------------------------------------------------------------------------------
/apps/web/app/verify-email/VerifyEmail.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useTrpc } from "@web/contexts/TrpcContext";
4 | import { useRouter } from "next/navigation";
5 | import { useEffect } from "react";
6 | import { StringParam, useQueryParam, withDefault } from "use-query-params";
7 | import { useUserContext } from "../user/UserContext";
8 |
9 | export default function VerifyEmail() {
10 | const { trpc } = useTrpc();
11 | const router = useRouter();
12 | const { setAccessToken, currentUser } = useUserContext();
13 | const [token] = useQueryParam("token", withDefault(StringParam, ""));
14 |
15 | const userJwt = trpc.userRouter.verifyAccessToken.useQuery({
16 | accessToken: token,
17 | });
18 |
19 | useEffect(() => {
20 | if (userJwt.data) {
21 | setAccessToken(token, userJwt.data.jwt.expiresIn);
22 | }
23 | }, [userJwt, setAccessToken, token]);
24 |
25 | useEffect(() => {
26 | if (currentUser) {
27 | router.push("/");
28 | }
29 | }, [currentUser, router]);
30 |
31 | return (
32 |
33 |
34 |
41 |
42 |
43 | {token
44 | ? "Verifying..."
45 | : "Please check your email to verify your account"}
46 |
47 |
48 |
49 |
('AWS_REGION', 'us-east-1');
13 | const accessKeyId = this.configService.get('AWS_ACCESS_KEY_ID');
14 | const secretAccessKey = this.configService.get('AWS_SECRET_ACCESS_KEY');
15 |
16 | this.bucketName = this.configService.get('AWS_S3_BUCKET', 'ult-uploads');
17 |
18 | if (accessKeyId && secretAccessKey) {
19 | this.s3Client = new S3Client({
20 | region,
21 | credentials: {
22 | accessKeyId,
23 | secretAccessKey,
24 | },
25 | });
26 | } else {
27 | // Use default AWS credentials (from IAM role, etc.)
28 | this.s3Client = new S3Client({ region });
29 | }
30 | }
31 |
32 | async getPresignedUploadUrl(
33 | fileName: string,
34 | fileType: string,
35 | expiresIn = 3600,
36 | ): Promise<{ uploadUrl: string; fileUrl: string }> {
37 | const key = `uploads/${Date.now()}-${fileName.replace(/[^a-zA-Z0-9.-]/g, '_')}`;
38 |
39 | const command = new PutObjectCommand({
40 | Bucket: this.bucketName,
41 | Key: key,
42 | ContentType: fileType,
43 | });
44 |
45 | const uploadUrl = await getSignedUrl(this.s3Client, command, { expiresIn });
46 |
47 | // Use the correct S3 URL format based on region
48 | const region = this.configService.get('AWS_REGION', 'us-east-1');
49 | const fileUrl = `https://${this.bucketName}.s3.${region}.amazonaws.com/${key}`;
50 |
51 | return {
52 | uploadUrl,
53 | fileUrl,
54 | };
55 | }
56 | }
--------------------------------------------------------------------------------
/apps/web/components/dashboard/Dialog.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useRef } from "react";
2 |
3 | type DialogProps = {
4 | children: React.ReactNode;
5 | onClose: () => void;
6 | };
7 |
8 | export const Dialog: React.FC = ({ children, onClose }) => {
9 | const modalRef = useRef(null); // Reference to the modal content
10 |
11 | const handleOutsideClick = (event: MouseEvent) => {
12 | if (modalRef.current && !modalRef.current.contains(event.target as Node)) {
13 | onClose();
14 | }
15 | };
16 |
17 | const handleEscapeKeyPress = (event: KeyboardEvent) => {
18 | if (event.key === "Escape") {
19 | onClose();
20 | }
21 | };
22 |
23 | useEffect(() => {
24 | // Disable body scroll
25 | const originalStyle = window.getComputedStyle(document.body).overflow;
26 | document.body.style.overflow = 'hidden';
27 |
28 | document.addEventListener("mousedown", handleOutsideClick);
29 | document.addEventListener("keydown", handleEscapeKeyPress);
30 |
31 | return () => {
32 | // Re-enable body scroll
33 | document.body.style.overflow = originalStyle;
34 |
35 | document.removeEventListener("mousedown", handleOutsideClick);
36 | document.removeEventListener("keydown", handleEscapeKeyPress);
37 | };
38 | }, []);
39 |
40 | return (
41 |
42 |
43 |
44 |
51 | {children}
52 |
53 |
54 |
59 |
60 | `$${value}`}
73 | />
74 |
82 |
83 | );
84 | }
--------------------------------------------------------------------------------
/apps/web/components/ui/button.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import { Slot } from "@radix-ui/react-slot"
3 | import { cva, type VariantProps } from "class-variance-authority"
4 |
5 | import { cn } from "@web/lib/utils"
6 |
7 | const buttonVariants = cva(
8 | "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
9 | {
10 | variants: {
11 | variant: {
12 | default:
13 | "bg-primary text-primary-foreground shadow hover:bg-primary/90",
14 | destructive:
15 | "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
16 | outline:
17 | "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
18 | secondary:
19 | "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
20 | ghost: "hover:bg-accent hover:text-accent-foreground",
21 | link: "text-primary underline-offset-4 hover:underline",
22 | },
23 | size: {
24 | default: "h-9 px-4 py-2",
25 | sm: "h-8 rounded-md px-3 text-xs",
26 | lg: "h-10 rounded-md px-8",
27 | icon: "h-9 w-9",
28 | },
29 | },
30 | defaultVariants: {
31 | variant: "default",
32 | size: "default",
33 | },
34 | }
35 | )
36 |
37 | export interface ButtonProps
38 | extends React.ButtonHTMLAttributes,
39 | VariantProps {
40 | asChild?: boolean
41 | }
42 |
43 | const Button = React.forwardRef(
44 | ({ className, variant, size, asChild = false, ...props }, ref) => {
45 | const Comp = asChild ? Slot : "button"
46 | return (
47 | ;
11 |
12 | export const PostUpdateDto = z.object({
13 | id: z.number(),
14 | title: z.string().optional(),
15 | categoryId: z.number().optional(),
16 | teaser: z.string().optional(),
17 | description: z.string().optional(),
18 | imageUrl: z.string().optional(),
19 | });
20 | export type PostUpdateDtoType = z.infer;
21 |
22 | export const PostRemoveDto = z.object({
23 | id: z.array(z.number()),
24 | });
25 | export type PostRemoveDtoType = z.infer;
26 |
27 | export const PostFindAllDto = z.object({
28 | page: z.number().default(1),
29 | perPage: z.number().default(10),
30 | categoryId: z.number().optional(),
31 | search: z.string().optional(),
32 | });
33 | export type PostFindAllDtoType = z.infer;
34 |
35 | export const PostFindByIdDto = z.object({
36 | id: z.number(),
37 | });
38 | export type PostFindByIdDtoType = z.infer;
39 |
40 | export const PostReactionCreateDto = z.object({
41 | postId: z.number(),
42 | type: z.nativeEnum(PostReactionType),
43 | });
44 | export type PostReactionCreateDtoType = z.infer;
45 |
46 | export const PostCommentCreateDto = z.object({
47 | postId: z.number(),
48 | message: z.string().min(1, 'Message can not be empty'),
49 | });
50 | export type PostCommentCreateDtoType = z.infer;
51 |
52 | export const PostCommentRemoveDto = z.object({
53 | id: z.number(),
54 | });
55 | export type PostCommentRemoveDtoType = z.infer;
56 |
57 | export const getUsername = (user?: User) => {
58 | if (!user) return;
59 | if (user?.username) {
60 | return user?.username;
61 | }
62 | const username = `${user?.firstName} ${user?.lastName}`;
63 | return username;
64 | };
65 |
--------------------------------------------------------------------------------
/apps/web/components/ui/card.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 |
3 | import { cn } from "@web/lib/utils"
4 |
5 | const Card = React.forwardRef<
6 | HTMLDivElement,
7 | React.HTMLAttributes
8 | >(({ className, ...props }, ref) => (
9 |
17 | ))
18 | Card.displayName = "Card"
19 |
20 | const CardHeader = React.forwardRef<
21 | HTMLDivElement,
22 | React.HTMLAttributes
23 | >(({ className, ...props }, ref) => (
24 |
29 | ))
30 | CardHeader.displayName = "CardHeader"
31 |
32 | const CardTitle = React.forwardRef<
33 | HTMLDivElement,
34 | React.HTMLAttributes
35 | >(({ className, ...props }, ref) => (
36 |
41 | ))
42 | CardTitle.displayName = "CardTitle"
43 |
44 | const CardDescription = React.forwardRef<
45 | HTMLDivElement,
46 | React.HTMLAttributes
47 | >(({ className, ...props }, ref) => (
48 |
53 | ))
54 | CardDescription.displayName = "CardDescription"
55 |
56 | const CardContent = React.forwardRef<
57 | HTMLDivElement,
58 | React.HTMLAttributes
59 | >(({ className, ...props }, ref) => (
60 |
61 | ))
62 | CardContent.displayName = "CardContent"
63 |
64 | const CardFooter = React.forwardRef<
65 | HTMLDivElement,
66 | React.HTMLAttributes
67 | >(({ className, ...props }, ref) => (
68 |
73 | ))
74 | CardFooter.displayName = "CardFooter"
75 |
76 | export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
--------------------------------------------------------------------------------
/apps/web/contexts/TrpcContext.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { AppRouter } from "@server/trpc/trpc.router"; // Adjust the import path as necessary
4 | import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
5 | import {
6 | CreateTRPCClientOptions,
7 | createTRPCProxyClient,
8 | createTRPCReact,
9 | httpBatchLink,
10 | } from "@trpc/react-query";
11 | import Cookies from "js-cookie";
12 | import React, { ReactNode, createContext, useContext, useState } from "react";
13 | import { transformer } from "@shared/transformer";
14 |
15 | const trpc = createTRPCReact();
16 | const trpcUrl =
17 | process.env.NEXT_PUBLIC_TRPC_URL || "http://localhost:3001/trpc"; // Default URL as fallback
18 | const jwtAccessToken = Cookies.get("jwtAccessToken");
19 | const httpBatchLinkOptions = {
20 | url: trpcUrl,
21 | transformer,
22 | headers: jwtAccessToken
23 | ? {
24 | Authorization: `Bearer ${jwtAccessToken}`,
25 | }
26 | : undefined,
27 | };
28 | const trpcClientOpts: CreateTRPCClientOptions = {
29 | links: [httpBatchLink(httpBatchLinkOptions)],
30 | transformer,
31 | };
32 |
33 | const trpcReactClient = trpc.createClient(trpcClientOpts);
34 | const trpcAsync = createTRPCProxyClient(trpcClientOpts);
35 |
36 | interface TrpcContextState {
37 | trpc: typeof trpc;
38 | trpcAsync: typeof trpcAsync;
39 | }
40 |
41 | // Context will now directly store the trpc client
42 | const TrpcContext = createContext({
43 | trpc,
44 | trpcAsync,
45 | });
46 | export const TrpcProvider: React.FC<{ children: ReactNode }> = ({
47 | children,
48 | }) => {
49 | const [queryClient] = useState(() => new QueryClient());
50 | const [trpcClient] = useState(() => trpcReactClient);
51 | return (
52 |
58 |
59 |
60 | {children}
61 |
62 |
63 |
64 | );
65 | };
66 | export const useTrpc = () => {
67 | const context = useContext(TrpcContext);
68 | if (context === undefined) {
69 | throw new Error("useTrpc must be used within a TrpcProvider");
70 | }
71 | return context;
72 | };
73 |
--------------------------------------------------------------------------------
/apps/web/app/test/Test.tsx:
--------------------------------------------------------------------------------
1 | // "use client";
2 |
3 | // import { useTrpcQuery } from "@web/hooks/useTrpcQuery";
4 | // import { useCallback, useState } from "react";
5 |
6 | // import {
7 | // UserCreateDtoType,
8 | // UserFindAllDtoType,
9 | // UserRemoveDtoType,
10 | // } from "@server/user/dto/user.dto";
11 | // import { trpc } from "@web/utils/trpc/trpc";
12 | // import { useTrpcMutate } from "@web/hooks/useTrpcMutate";
13 |
14 | // export default function Test() {
15 | // const [email, setEmail] = useState("");
16 | // const {
17 | // query: getUsers,
18 | // data: users,
19 | // isLoading: gettingUsers,
20 | // error: gettingUsersError,
21 | // } = useTrpcQuery(
22 | // useCallback(
23 | // (opts: UserFindAllDtoType) => trpc.userRouter.findAll.query(opts),
24 | // []
25 | // ),
26 | // false
27 | // );
28 |
29 | // const {
30 | // // mutate: createUser,
31 | // mutateAsync: createUser,
32 | // data: createdUser,
33 | // isLoading: creatingUser,
34 | // error: creatingUserError,
35 | // } = useTrpcMutate(async (userData: UserCreateDtoType) =>
36 | // trpc.userRouter.create.mutate(userData)
37 | // );
38 |
39 | // const {
40 | // mutate: removeUser,
41 | // data: removedUser,
42 | // isLoading: removingUser,
43 | // error: removingUserError,
44 | // } = useTrpcMutate(async (userData: UserRemoveDtoType) =>
45 | // trpc.userRouter.remove.mutate(userData)
46 | // );
47 |
48 | // return (
49 | // <>
50 | // {JSON.stringify(users)}
51 | // by email:
52 | // {JSON.stringify(createdUser)}
}
63 | // {
65 | // const createdUser = await createUser({
66 | // email: email || "jn@ni.com",
67 | // password: "password",
68 | // firstName: "john",
69 | // lastName: "cena",
70 | // });
71 | // await removeUser({ id: createdUser.id || 0 });
72 | // }}
73 | // >
74 | // create
75 | //
76 | //
77 | // );
78 | // }
79 |
--------------------------------------------------------------------------------
/apps/server/src/role/role.router.ts:
--------------------------------------------------------------------------------
1 | import { Injectable, UseFilters } from '@nestjs/common';
2 | import { RoleService } from '@server/role/role.service';
3 | import { TrpcExceptionFilter } from '@server/trpc/trpc.exception-handler';
4 | import { TrpcService } from '@server/trpc/trpc.service';
5 | import { Roles } from '@shared/interfaces';
6 | import {
7 | RoleCreateDto,
8 | RoleFindAllDto,
9 | RoleFindByIdDto,
10 | RoleRemoveDto,
11 | RoleUpdateDto,
12 | } from './role.dto';
13 |
14 | @Injectable()
15 | @UseFilters(new TrpcExceptionFilter())
16 | export class RoleRouter {
17 | constructor(
18 | private readonly trpcService: TrpcService,
19 | private readonly roleService: RoleService,
20 | ) {}
21 | apply() {
22 | const roleRouter = this.trpcService.trpc.router({
23 | // creates a role from dashboard
24 | create: this.trpcService
25 | .protectedProcedure([Roles.Admin])
26 | .input(RoleCreateDto)
27 | .mutation(async ({ input, ctx }) => {
28 | if (ctx.user) {
29 | return this.roleService.create(input);
30 | }
31 | }),
32 |
33 | // update role
34 | update: this.trpcService
35 | .protectedProcedure([Roles.Admin])
36 | .input(RoleUpdateDto)
37 | .mutation(async ({ input, ctx }) => {
38 | if (ctx.user) {
39 | return this.roleService.update(input);
40 | }
41 | }),
42 |
43 | // remove role
44 | remove: this.trpcService
45 | .protectedProcedure([Roles.Admin])
46 | .input(RoleRemoveDto)
47 | .mutation(async ({ input, ctx }) => {
48 | if (ctx.user) {
49 | return this.roleService.remove(input.id);
50 | }
51 | }),
52 |
53 | // get role by id
54 | findById: this.trpcService
55 | .publicProcedure()
56 | .input(RoleFindByIdDto)
57 | .query(async ({ input }) => {
58 | return this.roleService.findById(input.id);
59 | }),
60 |
61 | // get all roles
62 | findAll: this.trpcService
63 | .publicProcedure()
64 | .input(RoleFindAllDto)
65 | .query(async ({ input }) => {
66 | return this.roleService.findAll(input);
67 | }),
68 | });
69 |
70 | return {
71 | roleRouter,
72 | } as const;
73 | }
74 | }
75 |
--------------------------------------------------------------------------------
/apps/server/src/role/role.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@nestjs/common';
2 | import { InternalServerErrorException } from '@nestjs/common/exceptions';
3 | import { PrismaService } from '@server/prisma/prisma.service';
4 | import {
5 | RoleCreateDtoType,
6 | RoleFindAllDtoType,
7 | RoleUpdateDtoType,
8 | } from './role.dto';
9 |
10 | @Injectable()
11 | export class RoleService {
12 | constructor(private readonly prismaService: PrismaService) {}
13 |
14 | async create(roleCreateDto: RoleCreateDtoType) {
15 | // create
16 | try {
17 | const role = await this.prismaService.role.create({
18 | data: {
19 | ...roleCreateDto,
20 | },
21 | });
22 | return role;
23 | } catch (error: any) {
24 | throw new InternalServerErrorException(error.message);
25 | }
26 | }
27 |
28 | async update(roleUpdateDto: RoleUpdateDtoType) {
29 | try {
30 | const updatedRole = await this.prismaService.role.update({
31 | where: {
32 | id: roleUpdateDto.id,
33 | },
34 | data: { name: roleUpdateDto.name },
35 | });
36 | return updatedRole;
37 | } catch (error: any) {
38 | throw new InternalServerErrorException(error.message);
39 | }
40 | }
41 |
42 | async findAll(opts: RoleFindAllDtoType) {
43 | const records = await this.prismaService.role.findMany({
44 | skip: (opts.page - 1) * opts.perPage,
45 | take: opts.perPage,
46 | orderBy: {
47 | name: 'asc',
48 | },
49 | });
50 | const total = await this.prismaService.role.count();
51 | const lastPage = Math.ceil(total / opts.perPage);
52 | return {
53 | records,
54 | total,
55 | currentPage: opts.page,
56 | lastPage,
57 | perPage: opts.perPage,
58 | };
59 | }
60 |
61 | async findById(id: number) {
62 | return this.prismaService.role.findFirstOrThrow({
63 | where: { id },
64 | });
65 | }
66 |
67 | async remove(id: number | number[]) {
68 | let ids: number[] = [];
69 | if (id instanceof Array) {
70 | ids = id;
71 | } else if (typeof id === 'number') {
72 | ids = [id];
73 | }
74 | const output = [];
75 | for (const id of ids) {
76 | output.push(
77 | await this.prismaService.role.delete({
78 | where: {
79 | id,
80 | },
81 | }),
82 | );
83 | }
84 | return output;
85 | }
86 | }
87 |
--------------------------------------------------------------------------------
/apps/server/src/category/category.router.ts:
--------------------------------------------------------------------------------
1 | import { Injectable, UseFilters } from '@nestjs/common';
2 | import { CategoryService } from '@server/category/category.service';
3 | import { TrpcExceptionFilter } from '@server/trpc/trpc.exception-handler';
4 | import { TrpcService } from '@server/trpc/trpc.service';
5 | import { Roles } from '@shared/interfaces';
6 | import {
7 | CategoryCreateDto,
8 | CategoryFindAllDto,
9 | CategoryFindByIdDto,
10 | CategoryRemoveDto,
11 | CategoryUpdateDto,
12 | } from './category.dto';
13 |
14 | @Injectable()
15 | @UseFilters(new TrpcExceptionFilter())
16 | export class CategoryRouter {
17 | constructor(
18 | private readonly trpcService: TrpcService,
19 | private readonly categoryService: CategoryService,
20 | ) {}
21 | apply() {
22 | const categoryRouter = this.trpcService.trpc.router({
23 | // creates a category from dashboard
24 | create: this.trpcService
25 | .protectedProcedure()
26 | .input(CategoryCreateDto)
27 | .mutation(async ({ input, ctx }) => {
28 | if (ctx.user) {
29 | return this.categoryService.create(input);
30 | }
31 | }),
32 |
33 | // update category
34 | update: this.trpcService
35 | .protectedProcedure()
36 | .input(CategoryUpdateDto)
37 | .mutation(async ({ input, ctx }) => {
38 | if (ctx.user) {
39 | return this.categoryService.update(input);
40 | }
41 | }),
42 |
43 | // remove category
44 | remove: this.trpcService
45 | .protectedProcedure([Roles.Admin])
46 | .input(CategoryRemoveDto)
47 | .mutation(async ({ input, ctx }) => {
48 | if (ctx.user) {
49 | return this.categoryService.remove(input.id);
50 | }
51 | }),
52 |
53 | // get category by id
54 | findById: this.trpcService
55 | .publicProcedure()
56 | .input(CategoryFindByIdDto)
57 | .query(async ({ input }) => {
58 | return this.categoryService.findById(input.id);
59 | }),
60 |
61 | // get all categorys
62 | findAll: this.trpcService
63 | .publicProcedure()
64 | .input(CategoryFindAllDto)
65 | .query(async ({ input }) => {
66 | return this.categoryService.findAll(input);
67 | }),
68 | });
69 |
70 | return {
71 | categoryRouter,
72 | } as const;
73 | }
74 | }
75 |
--------------------------------------------------------------------------------
/apps/server/src/trpc/trpc.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@nestjs/common';
2 | import { Role } from '@prisma/client';
3 | import { UserService } from '@server/user/user.service';
4 | import { UserById } from '@shared/interfaces';
5 | import { transformer } from '@shared/transformer';
6 | import { TRPCError, initTRPC } from '@trpc/server';
7 | import * as trpcExpress from '@trpc/server/adapters/express';
8 | import { CreateExpressContextOptions } from '@trpc/server/adapters/express';
9 |
10 | export interface TrpcContext extends CreateExpressContextOptions {
11 | user?: UserById;
12 | }
13 |
14 | export const createContext = async (
15 | opts: trpcExpress.CreateExpressContextOptions,
16 | ) => {
17 | return {
18 | req: opts.req,
19 | res: opts.res,
20 | };
21 | };
22 |
23 | @Injectable()
24 | export class TrpcService {
25 | trpc;
26 | constructor(private readonly userService: UserService) {
27 | this.trpc = initTRPC.context().create({
28 | transformer,
29 | });
30 | }
31 |
32 | // these routes are publicly accessible to everyone
33 | publicProcedure() {
34 | return this.trpc.procedure;
35 | }
36 |
37 | // these routes requires authentication:
38 | // if allowedRoles is empty, it requires an authenticated user (access token in the header)
39 | // if allowedRoles is not empty, it requires an authenticated user with one of the allowed roles
40 | protectedProcedure(allowedRoles?: string[]) {
41 | const procedure = this.trpc.procedure.use(async (opts) => {
42 | // get bearer from headers
43 | const userJwt = await this.getJwtUserFromHeader(opts.ctx);
44 | // throw error if user is unauthorized
45 | if (
46 | !userJwt ||
47 | (allowedRoles?.length &&
48 | !userJwt.user.roles?.some((role) => allowedRoles.includes(role.name)))
49 | ) {
50 | throw new TRPCError({ code: 'UNAUTHORIZED' });
51 | }
52 | // user is authorized
53 | return opts.next({
54 | ctx: {
55 | ...opts.ctx,
56 | user: userJwt.user,
57 | },
58 | });
59 | });
60 | return procedure;
61 | }
62 |
63 | async getJwtUserFromHeader(ctx: TrpcContext) {
64 | // get bearer from headers
65 | const accessToken =
66 | ctx.req.headers.authorization?.replace('Bearer ', '') || '';
67 | if (!accessToken) {
68 | throw new TRPCError({ code: 'UNAUTHORIZED' });
69 | }
70 |
71 | // check if user has role privilege
72 | return this.userService.verifyAccessToken(accessToken);
73 | }
74 | }
75 |
--------------------------------------------------------------------------------
/apps/web/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "web",
3 | "version": "0.2.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "next dev",
7 | "build": "next build",
8 | "start": "next start",
9 | "prod": "next build && pnpm start",
10 | "lint": "next lint"
11 | },
12 | "dependencies": {
13 | "@headlessui/react": "^1.7.18",
14 | "@heroicons/react": "^2.1.1",
15 | "@hookform/resolvers": "^3.3.4",
16 | "@material-tailwind/react": "^2.1.9",
17 | "@next/third-parties": "^15.5.2",
18 | "@radix-ui/react-alert-dialog": "^1.1.15",
19 | "@radix-ui/react-dropdown-menu": "^2.1.16",
20 | "@radix-ui/react-label": "^2.1.7",
21 | "@radix-ui/react-navigation-menu": "^1.2.14",
22 | "@radix-ui/react-select": "^2.2.6",
23 | "@radix-ui/react-separator": "^1.1.7",
24 | "@radix-ui/react-slot": "^1.2.3",
25 | "@radix-ui/react-tooltip": "^1.2.8",
26 | "@react-pdf/renderer": "^3.4.2",
27 | "@tailwindcss/forms": "^0.5.7",
28 | "@tanstack/react-query": "^4.35.3",
29 | "@trpc/client": "^10.45.2",
30 | "@trpc/next": "^10.45.1",
31 | "@trpc/react-query": "^10.45.1",
32 | "@trpc/server": "^10.45.2",
33 | "axios": "^1.8.2",
34 | "class-variance-authority": "^0.7.1",
35 | "clsx": "^2.1.1",
36 | "date-fns": "^3.3.1",
37 | "date-fns-tz": "^2.0.0",
38 | "embla-carousel-autoplay": "^8.2.1",
39 | "embla-carousel-react": "^8.2.1",
40 | "js-cookie": "^3.0.5",
41 | "lodash": "^4.17.21",
42 | "lucide-react": "^0.542.0",
43 | "next": "^15.5.2",
44 | "next-query-params": "^5.0.0",
45 | "pdfjs-dist": "^4.8.69",
46 | "preline": "^2.0.3",
47 | "quill": "^2.0.3",
48 | "react": "^19.1.1",
49 | "react-aria": "^3.32.1",
50 | "react-dom": "^19.1.1",
51 | "react-hook-form": "^7.50.1",
52 | "react-phone-input-2": "^2.15.1",
53 | "react-phone-number-input": "^3.4.8",
54 | "react-query": "3",
55 | "react-quill": "^2.0.0",
56 | "react-stately": "^3.30.1",
57 | "react-toastify": "^10.0.4",
58 | "recharts": "^3.1.2",
59 | "tailwind-merge": "^3.3.1",
60 | "tailwindcss-animate": "^1.0.7",
61 | "use-query-params": "^2.2.1",
62 | "zod": "^3.22.4"
63 | },
64 | "devDependencies": {
65 | "@types/js-cookie": "^3.0.6",
66 | "@types/lodash": "^4.14.202",
67 | "@types/node": "^20",
68 | "@types/quill": "^2.0.14",
69 | "@types/react": "^19",
70 | "@types/react-dom": "^19",
71 | "autoprefixer": "^10.0.1",
72 | "eslint": "^8",
73 | "eslint-config-next": "^15.5.2",
74 | "postcss": "^8",
75 | "tailwindcss": "^3.3.0",
76 | "typescript": "^5"
77 | }
78 | }
79 |
--------------------------------------------------------------------------------
/apps/web/tailwind.config.ts:
--------------------------------------------------------------------------------
1 | import type { Config } from "tailwindcss";
2 |
3 | const withMT = require("@material-tailwind/react/utils/withMT");
4 |
5 | const config: Config = {
6 | darkMode: ["class"],
7 | content: [
8 | "./components/**/*.{js,ts,jsx,tsx,mdx}",
9 | "./app/**/*.{js,ts,jsx,tsx,mdx}",
10 | "./node_modules/preline/dist/*.js",
11 | ],
12 | theme: {
13 | extend: {
14 | colors: {
15 | beige: {
16 | '200': '#f5f5dc',
17 | '300': '#ede9e0',
18 | '500': '#d2b48c'
19 | },
20 | background: 'hsl(var(--background))',
21 | foreground: 'hsl(var(--foreground))',
22 | card: {
23 | DEFAULT: 'hsl(var(--card))',
24 | foreground: 'hsl(var(--card-foreground))'
25 | },
26 | popover: {
27 | DEFAULT: 'hsl(var(--popover))',
28 | foreground: 'hsl(var(--popover-foreground))'
29 | },
30 | primary: {
31 | DEFAULT: 'hsl(var(--primary))',
32 | foreground: 'hsl(var(--primary-foreground))'
33 | },
34 | secondary: {
35 | DEFAULT: 'hsl(var(--secondary))',
36 | foreground: 'hsl(var(--secondary-foreground))'
37 | },
38 | muted: {
39 | DEFAULT: 'hsl(var(--muted))',
40 | foreground: 'hsl(var(--muted-foreground))'
41 | },
42 | accent: {
43 | DEFAULT: 'hsl(var(--accent))',
44 | foreground: 'hsl(var(--accent-foreground))'
45 | },
46 | destructive: {
47 | DEFAULT: 'hsl(var(--destructive))',
48 | foreground: 'hsl(var(--destructive-foreground))'
49 | },
50 | border: 'hsl(var(--border))',
51 | input: 'hsl(var(--input))',
52 | ring: 'hsl(var(--ring))',
53 | chart: {
54 | '1': 'hsl(var(--chart-1))',
55 | '2': 'hsl(var(--chart-2))',
56 | '3': 'hsl(var(--chart-3))',
57 | '4': 'hsl(var(--chart-4))',
58 | '5': 'hsl(var(--chart-5))'
59 | },
60 | sidebar: {
61 | DEFAULT: 'hsl(var(--sidebar-background))',
62 | foreground: 'hsl(var(--sidebar-foreground))',
63 | primary: 'hsl(var(--sidebar-primary))',
64 | 'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',
65 | accent: 'hsl(var(--sidebar-accent))',
66 | 'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',
67 | border: 'hsl(var(--sidebar-border))',
68 | ring: 'hsl(var(--sidebar-ring))'
69 | }
70 | },
71 | borderRadius: {
72 | lg: 'var(--radius)',
73 | md: 'calc(var(--radius) - 2px)',
74 | sm: 'calc(var(--radius) - 4px)'
75 | }
76 | }
77 | },
78 | plugins: [require("@tailwindcss/forms"), require("preline/plugin"), require("tailwindcss-animate")],
79 | };
80 | export default withMT(config);
81 |
--------------------------------------------------------------------------------
/apps/server/src/user/user.dto.ts:
--------------------------------------------------------------------------------
1 | import { Roles } from '@shared/interfaces';
2 | import { z } from 'zod';
3 |
4 | export const UserLoginDto = z.object({
5 | email: z.string().email(),
6 | password: z.string().min(8, 'Password must be at least 8 characters'),
7 | });
8 | export type UserLoginDtoType = z.infer;
9 |
10 | export const UserSignupDto = z.object({
11 | email: z.string().email(),
12 | password: z.string().min(8, 'Password must be at least 8 characters'),
13 | firstName: z.string(),
14 | lastName: z.string(),
15 | phone: z.string().optional(),
16 | });
17 | export type UserSignupDtoType = z.infer;
18 |
19 | export const UserCreateDto = z.object({
20 | email: z.string().email(),
21 | password: z.string().min(8, 'Password must be at least 8 characters'),
22 | firstName: z.string(),
23 | lastName: z.string(),
24 | roles: z.array(z.nativeEnum(Roles)).optional(),
25 | phone: z.string().optional(),
26 | gender: z.string().optional(),
27 | bio: z.string().optional(),
28 | profilePicUrl: z.string().optional(),
29 | });
30 | export type UserCreateDtoType = z.infer;
31 |
32 | export const UserUpdateDto = z.object({
33 | id: z.number(),
34 | firstName: z.string().min(1, 'First name is required'),
35 | lastName: z.string().min(1, 'Last name is required'),
36 | username: z.string(),
37 | roles: z.array(z.nativeEnum(Roles)).optional(),
38 | email: z.string().email(),
39 | password: z
40 | .string()
41 | // .min(8, 'Password must be at least 8 characters')
42 | .optional(),
43 | phone: z.string().optional(),
44 | gender: z.string().optional(),
45 | bio: z.string().optional(),
46 | profilePicUrl: z.string().optional(),
47 | });
48 | export type UserUpdateDtoType = z.infer;
49 |
50 | export const UserRemoveDto = z.object({
51 | id: z.array(z.number()),
52 | });
53 | export type UserRemoveDtoType = z.infer;
54 |
55 | export const UserFindAllDto = z.object({
56 | page: z.number().default(1),
57 | perPage: z.number().default(10),
58 | search: z.string().optional(),
59 | });
60 | export type UserFindAllDtoType = z.infer;
61 |
62 | export const UserFindByIdDto = z.object({
63 | id: z.number(),
64 | });
65 | export type UserFindByIdDtoType = z.infer;
66 |
67 | export const UserVerifyAccessTokenDto = z.object({
68 | accessToken: z.string(),
69 | });
70 | export type UserVerifyAccessTokenType = z.infer<
71 | typeof UserVerifyAccessTokenDto
72 | >;
73 |
74 | export const UserResetPasswordDto = z.object({
75 | email: z.string().email(),
76 | });
77 | export type UserResetPasswordType = z.infer;
78 |
--------------------------------------------------------------------------------
/.github/workflows/deploy-with-ssh.yml:
--------------------------------------------------------------------------------
1 | name: deploy-with-ssh
2 |
3 | on:
4 | push:
5 | branches:
6 | - main
7 |
8 | jobs:
9 | build_and_deploy:
10 | runs-on: ubuntu-latest
11 |
12 | permissions:
13 | contents: read
14 | packages: write
15 |
16 | env:
17 | SSH_HOST: ${{ secrets.SSH_SERVER }}
18 | WORKING_DIR: ${{ secrets.SSH_WORKING_DIR }}
19 | DOCKER_COMPOSE_FILE: docker-compose.prod.yml
20 |
21 | steps:
22 | - name: Checkout code
23 | uses: actions/checkout@v2
24 |
25 | - name: Login to GitHub Container Registry
26 | uses: docker/login-action@v1
27 | with:
28 | registry: ghcr.io
29 | username: ${{ github.actor }}
30 | password: ${{ secrets.GITHUB_TOKEN }}
31 |
32 | - name: Set up Docker Buildx
33 | uses: docker/setup-buildx-action@v1
34 |
35 | - name: Build and push Docker image
36 | uses: docker/build-push-action@v2
37 | with:
38 | context: .
39 | push: true
40 | tags: ghcr.io/${{ github.repository }}:latest
41 |
42 | - name: Set up SSH agent
43 | uses: webfactory/ssh-agent@v0.5.3
44 | with:
45 | ssh-private-key: ${{ secrets.SSH_PRIVATE_KEY }}
46 |
47 | - name: Copy Docker Compose file
48 | run: |
49 | scp -o StrictHostKeyChecking=no $DOCKER_COMPOSE_FILE $SSH_HOST:$WORKING_DIR/
50 |
51 | - name: Log in to GitHub Container Registry
52 | run: |
53 | ssh -o StrictHostKeyChecking=no $SSH_HOST "echo ${{ secrets.GITHUB_TOKEN }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin"
54 |
55 | - name: Pull Docker images
56 | run: |
57 | ssh -o StrictHostKeyChecking=no $SSH_HOST "docker pull ghcr.io/${{ github.repository }}:latest"
58 |
59 | - name: Check and setup nginx-proxy
60 | run: |
61 | ssh -o StrictHostKeyChecking=no $SSH_HOST "
62 | if ! docker network inspect proxy-network >/dev/null 2>&1; then
63 | echo 'Creating proxy-network...'
64 | docker network create proxy-network
65 | fi
66 | if ! docker ps | grep -q nginx-proxy; then
67 | echo 'nginx-proxy not detected. Setting it up...'
68 | docker run -d -p 80:80 \
69 | --name nginx-proxy \
70 | --network proxy-network \
71 | --restart always \
72 | -v /var/run/docker.sock:/tmp/docker.sock:ro \
73 | jwilder/nginx-proxy
74 | else
75 | echo 'nginx-proxy already running. Skipping setup.'
76 | fi
77 | "
78 | - name: Run Docker Compose
79 | run: |
80 | ssh -o StrictHostKeyChecking=no $SSH_HOST "cd $WORKING_DIR && docker-compose -f $DOCKER_COMPOSE_FILE up -d"
81 |
--------------------------------------------------------------------------------
/apps/server/src/app.module.ts:
--------------------------------------------------------------------------------
1 | import { Module } from '@nestjs/common';
2 | import { ConfigModule } from '@nestjs/config';
3 | import * as Joi from 'joi';
4 | import { AppController } from './app.controller';
5 | import { AppService } from './app.service';
6 | import { AuthModule } from './auth/auth.module';
7 | import { OpenaiModule } from './openai/openai.module';
8 | import { PrismaService } from './prisma/prisma.service';
9 | import { TrpcModule } from './trpc/trpc.module';
10 | import { UploadModule } from './upload/upload.module';
11 | import { UserModule } from './user/user.module';
12 |
13 | @Module({
14 | imports: [
15 | OpenaiModule,
16 | ConfigModule.forRoot({
17 | isGlobal: true,
18 | expandVariables: true,
19 | envFilePath: `${process.cwd()}/.env.${process.env.NODE_ENV ?? 'development'}`,
20 | validationSchema: Joi.object({
21 | // DO NOT update these directly, update them from the .env.x files,
22 | // server config
23 | NODE_ENV: Joi.string()
24 | .valid('development', 'production', 'test', 'provision')
25 | .default('development'),
26 | API_HOST: Joi.string(),
27 | APP_HOST: Joi.string(),
28 |
29 | // auth config
30 | JWT_SECRET: Joi.string(),
31 | JWT_EXPIRES_IN: Joi.string().default('365d'),
32 |
33 | // database config
34 | DB_URL: Joi.string().default(
35 | 'postgresql://postgres:password@localhost:5432/postgres?schema=public',
36 | ),
37 |
38 | // mailer config
39 | MAIL_SMTP_HOST: Joi.string().default('smtp-relay.brevo.com'),
40 | MAIL_SMTP_PORT: Joi.number().default(587),
41 | MAIL_SMTP_SECURE: Joi.boolean().default(true),
42 | MAIL_SMTP_USERNAME: Joi.string().default('user@gmail.com'),
43 | MAIL_SMTP_PASSWORD: Joi.string().default('password'),
44 | MAIL_DEFAULT_FROM: Joi.string().default('user@gmail.com'),
45 |
46 | // Google SSO config
47 | GOOGLE_CLIENT_ID: Joi.string(),
48 | GOOGLE_CLIENT_SECRET: Joi.string(),
49 | GOOGLE_CALLBACK_URL: Joi.string(),
50 |
51 | // OpenAI config
52 | OPENAI_API_KEY: Joi.string(),
53 |
54 | // Pinecone config
55 | PINECONE_API_KEY: Joi.string(),
56 |
57 | // AWS S3 config
58 | AWS_REGION: Joi.string().default('us-east-1'),
59 | AWS_S3_BUCKET: Joi.string().default('ult-uploads'),
60 | AWS_ACCESS_KEY_ID: Joi.string().optional(),
61 | AWS_SECRET_ACCESS_KEY: Joi.string().optional(),
62 | }),
63 | }),
64 | TrpcModule,
65 | UserModule,
66 | AuthModule,
67 | OpenaiModule,
68 | UploadModule,
69 | ],
70 | controllers: [AppController],
71 | providers: [AppService, PrismaService],
72 | })
73 | export class AppModule {}
74 |
--------------------------------------------------------------------------------
/apps/web/components/home/WeatherWidget.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState } from "react";
2 |
3 | interface WeatherData {
4 | name: string;
5 | main: {
6 | temp: number;
7 | temp_min: number;
8 | temp_max: number;
9 | humidity: number;
10 | };
11 | weather: {
12 | description: string;
13 | icon: string;
14 | }[];
15 | }
16 |
17 | const WeatherWidget: React.FC = () => {
18 | const [weatherData, setWeatherData] = useState(null);
19 | const [loading, setLoading] = useState(true);
20 | const [zipcode, setZipcode] = useState("90210");
21 | const [city, setCity] = useState("Los Angeles");
22 | const [error, setError] = useState(null);
23 |
24 | const fetchWeather = async () => {
25 | try {
26 | const response = await fetch(
27 | `https://api.openweathermap.org/data/2.5/weather?q=${city}&units=imperial&appid=${process.env.NEXT_PUBLIC_OPENWEATHERMAP_API_KEY}`
28 | );
29 | if (!response.ok) {
30 | throw new Error("Failed to fetch weather data");
31 | }
32 | const data: WeatherData = await response.json();
33 | setWeatherData(data);
34 | } catch (err) {
35 | setError((err as Error).message);
36 | } finally {
37 | setLoading(false);
38 | }
39 | };
40 |
41 | useEffect(() => {
42 | fetchWeather();
43 | }, [city]);
44 |
45 | if (loading) {
46 | return (
47 |
50 | );
51 | }
52 | if (error) return Error: {error}
;
53 |
54 | return (
55 |
56 |
Today's Weather
57 |
58 |
62 |
63 |
64 |
Current
65 |
{Math.round(weatherData?.main.temp || 0)}°F
66 |
67 |
68 |
69 | {Math.round(weatherData?.main.temp_min || 0)}°F /{" "}
70 | {Math.round(weatherData?.main.temp_max || 0)}°F
71 |
72 |
73 |
74 |
75 | setCity(e.target.value)}
78 | >
79 | Los Angeles
80 | San Francisco
81 | San Diego
82 | San Jose
83 | San Francisco
84 |
85 |
86 |
27 |
28 | {/* Notification panel, dynamically insert this into the live region when it needs to be displayed */}
29 |
39 |
40 |
41 |
42 |
43 |
48 |
49 |
50 | {props.title}
51 |
52 |
53 | {props.message}
54 |
55 |
56 |
57 | {
61 | setShowToast(false);
62 | }}
63 | >
64 | Close
65 |
67 |
68 |
69 |
70 |
72 |
73 |
(null);
10 |
11 | useEffect(() => {
12 | const scrollContainer = scrollContainerRef.current;
13 | if (scrollContainer) {
14 | let isDown = false;
15 | let startX: number;
16 | let scrollLeft: number;
17 |
18 | const handleMouseDown = (e: MouseEvent) => {
19 | isDown = true;
20 | startX = e.pageX - scrollContainer.offsetLeft;
21 | scrollLeft = scrollContainer.scrollLeft;
22 | };
23 |
24 | const handleMouseLeave = () => {
25 | isDown = false;
26 | };
27 |
28 | const handleMouseUp = () => {
29 | isDown = false;
30 | };
31 |
32 | const handleMouseMove = (e: MouseEvent) => {
33 | if (!isDown) return;
34 | e.preventDefault();
35 | const x = e.pageX - scrollContainer.offsetLeft;
36 | const walk = (x - startX) * 2;
37 | scrollContainer.scrollLeft = scrollLeft - walk;
38 | };
39 |
40 | scrollContainer.addEventListener("mousedown", handleMouseDown);
41 | scrollContainer.addEventListener("mouseleave", handleMouseLeave);
42 | scrollContainer.addEventListener("mouseup", handleMouseUp);
43 | scrollContainer.addEventListener("mousemove", handleMouseMove);
44 |
45 | return () => {
46 | scrollContainer.removeEventListener("mousedown", handleMouseDown);
47 | scrollContainer.removeEventListener("mouseleave", handleMouseLeave);
48 | scrollContainer.removeEventListener("mouseup", handleMouseUp);
49 | scrollContainer.removeEventListener("mousemove", handleMouseMove);
50 | };
51 | }
52 | }, []);
53 |
54 | return (
55 |
56 |
60 | {categories?.map((category) => (
61 |
62 |
73 |
78 |
82 | ))}
83 |
84 |
85 | );
86 | }
87 |
--------------------------------------------------------------------------------
/apps/server/src/auth/auth.service.ts:
--------------------------------------------------------------------------------
1 | import { Injectable } from '@nestjs/common';
2 | import { ConfigService } from '@nestjs/config';
3 | import { JwtService } from '@nestjs/jwt';
4 | import { User } from '@prisma/client';
5 | import { AuthJwt } from '@server/auth/auth.types';
6 | import { PrismaService } from '@server/prisma/prisma.service';
7 | import bcrypt from 'bcryptjs';
8 |
9 | @Injectable()
10 | export class AuthService {
11 | constructor(
12 | private readonly configService: ConfigService,
13 | private readonly jwtService: JwtService,
14 | private readonly prismaService: PrismaService,
15 | ) {}
16 |
17 | async verifyPassword(password: string, encryptedPassword: string) {
18 | return bcrypt.compare(password, encryptedPassword);
19 | }
20 |
21 | async encryptPassword(password: string) {
22 | const rounds = 10;
23 | let encryptedPassword;
24 | // do not hash again if already hashed
25 | if (password.indexOf('$2a$') === 0 && password.length === 60) {
26 | encryptedPassword = password;
27 | } else {
28 | encryptedPassword = await bcrypt.hash(password, rounds);
29 | }
30 | return encryptedPassword;
31 | }
32 |
33 | getJwt(user: User): AuthJwt {
34 | const expiresIn =
35 | this.configService.get('JWT_EXPIRES_IN') || '365d';
36 | const payload = {
37 | username: user.email,
38 | sub: user.id,
39 | expiresIn,
40 | };
41 | const accessToken = this.jwtService.sign(payload);
42 | return { accessToken, expiresIn };
43 | }
44 |
45 | async decodeJwtToken(accessToken: string) {
46 | return this.jwtService.verifyAsync(accessToken, {
47 | secret: this.configService.get('JWT_SECRET'),
48 | });
49 | }
50 |
51 | async loginFromGoogle(req: any) {
52 | let user: User | null;
53 | if (req.user.email) {
54 | user = await this.prismaService.user.findFirst({
55 | where: {
56 | email: req.user.email,
57 | },
58 | });
59 | if (!user) {
60 | // assign a default User role
61 | let roleConnections: { id: number }[] = [];
62 | const role = await this.prismaService.role.findFirst({
63 | where: {
64 | name: 'User',
65 | },
66 | });
67 | if (role) {
68 | roleConnections = [{ id: role.id }];
69 | }
70 |
71 | user = await this.prismaService.user.create({
72 | data: {
73 | email: req.user.email,
74 | password: '',
75 | verifiedAt: new Date(),
76 | lastLoggedInAt: new Date(),
77 | firstName: req.user.firstName,
78 | lastName: req.user.lastName,
79 | profilePicUrl: req.user.picture,
80 | authType: 'google',
81 | roles: {
82 | connect: roleConnections,
83 | },
84 | },
85 | });
86 | } else {
87 | await this.prismaService.user.update({
88 | where: {
89 | id: user.id,
90 | },
91 | data: {
92 | lastLoggedInAt: new Date(),
93 | profilePicUrl: req.user.picture,
94 | },
95 | });
96 | }
97 | const jwt = this.getJwt(user);
98 | return { user, jwt };
99 | }
100 | }
101 | }
102 |
--------------------------------------------------------------------------------
/apps/server/src/user/user.router.ts:
--------------------------------------------------------------------------------
1 | import { Injectable, UseFilters } from '@nestjs/common';
2 | import { TrpcExceptionFilter } from '@server/trpc/trpc.exception-handler';
3 | import { TrpcService } from '@server/trpc/trpc.service';
4 | import { UserService } from '@server/user/user.service';
5 | import { Roles } from '@shared/interfaces';
6 | import {
7 | UserCreateDto,
8 | UserFindAllDto,
9 | UserFindByIdDto,
10 | UserLoginDto,
11 | UserRemoveDto,
12 | UserResetPasswordDto,
13 | UserSignupDto,
14 | UserUpdateDto,
15 | UserVerifyAccessTokenDto,
16 | } from './user.dto';
17 |
18 | @Injectable()
19 | @UseFilters(new TrpcExceptionFilter())
20 | export class UserRouter {
21 | constructor(
22 | private readonly trpcService: TrpcService,
23 | private readonly userService: UserService,
24 | ) {}
25 | apply() {
26 | const userRouter = this.trpcService.trpc.router({
27 | // login user
28 | login: this.trpcService
29 | .publicProcedure()
30 | .input(UserLoginDto)
31 | .mutation(async ({ input }) => {
32 | return this.userService.login(input);
33 | }),
34 |
35 | // signs up a user
36 | signup: this.trpcService
37 | .publicProcedure()
38 | .input(UserSignupDto)
39 | .mutation(async ({ input }) => {
40 | return this.userService.signup(input);
41 | }),
42 |
43 | // creates a user from dashboard
44 | create: this.trpcService
45 | .protectedProcedure([Roles.Admin])
46 | .input(UserCreateDto)
47 | .mutation(async ({ input }) => {
48 | return this.userService.create(input);
49 | }),
50 |
51 | // update user
52 | update: this.trpcService
53 | .protectedProcedure()
54 | .input(UserUpdateDto)
55 | .mutation(async ({ input, ctx }) => {
56 | return this.userService.update(input, ctx.user);
57 | }),
58 |
59 | // remove user
60 | remove: this.trpcService
61 | .protectedProcedure([Roles.Admin, Roles.User])
62 | .input(UserRemoveDto)
63 | .mutation(async ({ input, ctx }) => {
64 | return this.userService.remove(input.id, ctx.user);
65 | }),
66 |
67 | // get user by id
68 | findById: this.trpcService
69 | .protectedProcedure()
70 | .input(UserFindByIdDto)
71 | .query(async ({ input }) => {
72 | return this.userService.findById(input.id);
73 | }),
74 |
75 | // get all users
76 | findAll: this.trpcService
77 | .protectedProcedure([Roles.Admin])
78 | .input(UserFindAllDto)
79 | .query(async ({ input }) => {
80 | return this.userService.findAll(input);
81 | }),
82 |
83 | // get user by id
84 | verifyAccessToken: this.trpcService
85 | .publicProcedure()
86 | .input(UserVerifyAccessTokenDto)
87 | .query(async ({ input }) => {
88 | return this.userService.verifyAccessToken(input.accessToken);
89 | }),
90 |
91 | // reset user password
92 | resetPassword: this.trpcService
93 | .publicProcedure()
94 | .input(UserResetPasswordDto)
95 | .mutation(async ({ input }) => {
96 | return this.userService.resetPassword({ email: input.email });
97 | }),
98 | });
99 |
100 | return {
101 | userRouter,
102 | } as const;
103 | }
104 | }
105 |
--------------------------------------------------------------------------------
/apps/web/components/ui/table.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 |
3 | import { cn } from "@web/lib/utils"
4 |
5 | const Table = React.forwardRef<
6 | HTMLTableElement,
7 | React.HTMLAttributes
8 | >(({ className, ...props }, ref) => (
9 |
16 | ))
17 | Table.displayName = "Table"
18 |
19 | const TableHeader = React.forwardRef<
20 | HTMLTableSectionElement,
21 | React.HTMLAttributes
22 | >(({ className, ...props }, ref) => (
23 |
30 | >(({ className, ...props }, ref) => (
31 |
42 | >(({ className, ...props }, ref) => (
43 | tr]:last:border-b-0",
47 | className
48 | )}
49 | {...props}
50 | />
51 | ))
52 | TableFooter.displayName = "TableFooter"
53 |
54 | const TableRow = React.forwardRef<
55 | HTMLTableRowElement,
56 | React.HTMLAttributes
57 | >(({ className, ...props }, ref) => (
58 |
72 | >(({ className, ...props }, ref) => (
73 | [role=checkbox]]:translate-y-[2px]",
77 | className
78 | )}
79 | {...props}
80 | />
81 | ))
82 | TableHead.displayName = "TableHead"
83 |
84 | const TableCell = React.forwardRef<
85 | HTMLTableCellElement,
86 | React.TdHTMLAttributes
87 | >(({ className, ...props }, ref) => (
88 | [role=checkbox]]:translate-y-[2px]",
92 | className
93 | )}
94 | {...props}
95 | />
96 | ))
97 | TableCell.displayName = "TableCell"
98 |
99 | const TableCaption = React.forwardRef<
100 | HTMLTableCaptionElement,
101 | React.HTMLAttributes
102 | >(({ className, ...props }, ref) => (
103 | ({
24 | resolver: zodResolver(RoleUpdateDto),
25 | });
26 |
27 | const data = getValues(); // Gets all current form values
28 |
29 | // set default form values
30 | useEffect(() => {
31 | if (role.data) {
32 | const formData = {
33 | id: role.data.id,
34 | name: role.data.name,
35 | };
36 | reset(formData);
37 | }
38 | }, [role.data, reset]);
39 |
40 | return (
41 |
42 | {/* Card */}
43 |
44 |
45 |
46 | {data?.name}
47 |
48 |
49 | * means required
50 |
51 |
52 |
103 |
104 |
({
18 | resolver: zodResolver(UserResetPasswordDto),
19 | });
20 | const resetPassword = trpc.userRouter.resetPassword.useMutation();
21 |
22 | return (
23 | <>
24 |
25 |
26 |
27 | Forgot Password
28 |
29 |
30 | Find your password by email.
31 |
32 |
33 | {resetPassword.data && (
34 |
35 | Find your password by email.
36 |
37 | )}
38 |
39 | {!resetPassword.data && (
40 |
41 |
89 | {resetPassword.error && (
90 |
91 | {resetPassword.error.message}
92 |
93 | )}
94 |
95 | )}
96 |
97 |
> | null; // Allow null here
24 | accessToken: string | null;
25 | setAccessToken: (accessToken: string, expiresIn: string) => void;
26 | logout: () => void;
27 | isAuthenticating: boolean;
28 | }
29 |
30 | // Define a default context value that matches the shape of UserContextState
31 | const defaultContextValue: UserContextState = {
32 | currentUser: null, // Default to null, but now it's explicitly part of the context type
33 | setCurrentUser: null,
34 | accessToken: "af",
35 | setAccessToken: (accessToken: string, expiresIn: string) => {},
36 | logout: () => {},
37 | isAuthenticating: true,
38 | };
39 |
40 | // Context creation with a default value that matches the expected shape
41 | const UserContext = createContext(defaultContextValue);
42 |
43 | // Provider Component
44 | export const UserProvider: React.FC = ({ children }) => {
45 | const [currentUser, setCurrentUser] = useState(null);
46 | const [token, setToken] = useState(null);
47 | const [isAuthenticating, setIsAuthenticating] = useState(true); // Initially true, assuming authentication check is in progress
48 | const { trpcAsync } = useTrpc();
49 | const trpcAsyncRef = useRef(trpcAsync);
50 |
51 | useEffect(() => {
52 | const fetchUser = async () => {
53 | const tokenFromCookie = Cookies.get("jwtAccessToken");
54 | if (tokenFromCookie) {
55 | setIsAuthenticating(true); // Begin authentication check only if token exists
56 | try {
57 | const userJwt =
58 | await trpcAsyncRef.current.userRouter.verifyAccessToken.query({
59 | accessToken: tokenFromCookie,
60 | });
61 | if (userJwt.user.verifiedAt) {
62 | setCurrentUser(userJwt.user);
63 | }
64 | } catch (error) {
65 | console.error("Error fetching user:", error);
66 | // Optionally, handle error state here
67 | }
68 | setIsAuthenticating(false); // End authentication check
69 | } else {
70 | // Immediately consider authentication check complete if no token
71 | setIsAuthenticating(false);
72 | }
73 | };
74 | fetchUser();
75 | }, [token, trpcAsyncRef]);
76 |
77 | // Provide both user and setUser to the context value
78 | const contextValue = {
79 | currentUser,
80 | setCurrentUser,
81 | accessToken: token,
82 | setAccessToken: (token: string, expiresIn: string) => {
83 | const expires = parseExpiresIn(expiresIn);
84 | Cookies.set("jwtAccessToken", token, {
85 | expires,
86 | secure: process.env.NODE_ENV === "production" ? true : false,
87 | sameSite: "Strict",
88 | });
89 | setToken(token);
90 | },
91 | logout: () => {
92 | setCurrentUser(null);
93 | setToken(null);
94 | Cookies.remove("jwtAccessToken", {
95 | secure: true,
96 | sameSite: "Strict",
97 | });
98 | },
99 | isAuthenticating,
100 | };
101 |
102 | return (
103 | {children}
104 | );
105 | };
106 |
107 | // Hook for easy context usage
108 | export const useUserContext = () => useContext(UserContext);
109 |
110 | function parseExpiresIn(expiresIn: string) {
111 | const unit = expiresIn.slice(-1);
112 | const value = parseInt(expiresIn.slice(0, -1), 10);
113 | switch (unit) {
114 | case "h": // hours
115 | return value / 24; // Convert hours to days
116 | case "d": // days
117 | return value;
118 | default:
119 | return undefined; // Default case, might be useful to handle 's' for seconds or other formats
120 | }
121 | }
122 |
--------------------------------------------------------------------------------
/apps/web/components/ui/dialog.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as DialogPrimitive from "@radix-ui/react-dialog"
5 | import { Cross2Icon } from "@radix-ui/react-icons"
6 |
7 | import { cn } from "@web/lib/utils"
8 |
9 | const Dialog = DialogPrimitive.Root
10 |
11 | const DialogTrigger = DialogPrimitive.Trigger
12 |
13 | const DialogPortal = DialogPrimitive.Portal
14 |
15 | const DialogClose = DialogPrimitive.Close
16 |
17 | const DialogOverlay = React.forwardRef<
18 | React.ElementRef,
19 | React.ComponentPropsWithoutRef
20 | >(({ className, ...props }, ref) => (
21 | ,
34 | React.ComponentPropsWithoutRef
35 | >(({ className, children, ...props }, ref) => (
36 |
37 |
46 | {children}
47 |
48 | Close
50 |
51 |
52 |
53 | ))
54 | DialogContent.displayName = DialogPrimitive.Content.displayName
55 |
56 | const DialogHeader = ({
57 | className,
58 | ...props
59 | }: React.HTMLAttributes) => (
60 |
67 | )
68 | DialogHeader.displayName = "DialogHeader"
69 |
70 | const DialogFooter = ({
71 | className,
72 | ...props
73 | }: React.HTMLAttributes) => (
74 |
81 | )
82 | DialogFooter.displayName = "DialogFooter"
83 |
84 | const DialogTitle = React.forwardRef<
85 | React.ElementRef,
86 | React.ComponentPropsWithoutRef
87 | >(({ className, ...props }, ref) => (
88 | ,
101 | React.ComponentPropsWithoutRef
102 | >(({ className, ...props }, ref) => (
103 | ({
23 | resolver: zodResolver(UserResetPasswordDto),
24 | });
25 | const resetPassword = trpc.userRouter.resetPassword.useMutation();
26 |
27 | return (
28 |
29 |
30 |
31 |
32 | Reset password
33 |
34 | Enter your email address and we'll send you a link to reset your password
35 |
36 |
37 |
38 | {resetPassword.data ? (
39 |
40 |
41 |
42 | We've sent a password reset link to your email address.
43 | Please check your inbox and follow the instructions.
44 |
45 |
46 |
48 |
92 | {resetPassword.error.message}
93 |
94 | )}
95 |
96 | {!resetPassword.data && (
97 |
98 |
99 | Remember your password?{" "}
100 |
107 |
108 | )}
109 |
110 |
111 |
({
23 | resolver: zodResolver(RoleCreateDto),
24 | });
25 | return (
26 | {
28 | if (props.onClose) {
29 | props.onClose();
30 | }
31 | }}
32 | >
33 |
34 |
35 |
36 |
37 | Add a new role
38 |
39 |
40 | * means required
41 |
42 |
43 |
44 |
106 |
108 | );
109 | }
110 |
--------------------------------------------------------------------------------
/apps/web/app/verify-email/ShadcnVerifyEmail.tsx:
--------------------------------------------------------------------------------
1 | "use client";
2 |
3 | import { useTrpc } from "@web/contexts/TrpcContext";
4 | import { useRouter } from "next/navigation";
5 | import { useEffect } from "react";
6 | import { StringParam, useQueryParam, withDefault } from "use-query-params";
7 | import { useUserContext } from "../user/UserContext";
8 | import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@web/components/ui/card";
9 | import { Button } from "@web/components/ui/button";
10 | import { Loader2, Mail, CheckCircle, XCircle } from "lucide-react";
11 | import Link from "next/link";
12 |
13 | export default function ShadcnVerifyEmail() {
14 | const { trpc } = useTrpc();
15 | const router = useRouter();
16 | const { setAccessToken, currentUser } = useUserContext();
17 | const [token] = useQueryParam("token", withDefault(StringParam, ""));
18 |
19 | const userJwt = trpc.userRouter.verifyAccessToken.useQuery({
20 | accessToken: token,
21 | });
22 |
23 | useEffect(() => {
24 | if (userJwt.data) {
25 | setAccessToken(token, userJwt.data.jwt.expiresIn);
26 | }
27 | }, [userJwt, setAccessToken, token]);
28 |
29 | useEffect(() => {
30 | if (currentUser) {
31 | setTimeout(() => {
32 | router.push("/");
33 | }, 2000);
34 | }
35 | }, [currentUser, router]);
36 |
37 | return (
38 |
39 |
40 |
41 |
42 | Email Verification
43 |
44 | {token ? "Verifying your email address" : "Check your email"}
45 |
46 |
47 |
48 | {token ? (
49 | <>
50 | {userJwt.isLoading && (
51 | <>
52 |
54 | Please wait while we verify your email...
55 |
56 |
57 | )}
58 |
59 | {userJwt.data && currentUser && (
60 | <>
61 |
63 |
64 | Email verified successfully!
65 |
66 |
67 | Redirecting you to the homepage...
68 |
69 |
77 |
78 | Verification failed
79 |
80 |
81 | {userJwt.error.message || "The verification link may be invalid or expired."}
82 |
83 |
85 |
87 |
88 | )}
89 |
90 | ) : (
91 | <>
92 |
94 |
95 | Check your inbox
96 |
97 |
98 | We've sent a verification link to your email address.
99 | Please click the link to verify your account.
100 |
101 |
103 |
104 |
106 |
107 |
108 | )}
109 |
110 |
111 |
112 |
({
24 | resolver: zodResolver(CategoryCreateDto),
25 | });
26 | return (
27 | {
29 | if (props.onClose) {
30 | props.onClose();
31 | }
32 | }}
33 | >
34 |
35 |
36 |
37 |
38 | Add a new category
39 |
40 |
41 | * means required
42 |
43 |
44 |
45 |
107 |
109 | );
110 | }
111 |
--------------------------------------------------------------------------------
/apps/web/components/ui/sheet.tsx:
--------------------------------------------------------------------------------
1 | "use client"
2 |
3 | import * as React from "react"
4 | import * as SheetPrimitive from "@radix-ui/react-dialog"
5 | import { cva, type VariantProps } from "class-variance-authority"
6 | import { X } from "lucide-react"
7 |
8 | import { cn } from "@web/lib/utils"
9 |
10 | const Sheet = SheetPrimitive.Root
11 |
12 | const SheetTrigger = SheetPrimitive.Trigger
13 |
14 | const SheetClose = SheetPrimitive.Close
15 |
16 | const SheetPortal = SheetPrimitive.Portal
17 |
18 | const SheetOverlay = React.forwardRef<
19 | React.ElementRef,
20 | React.ComponentPropsWithoutRef
21 | >(({ className, ...props }, ref) => (
22 | ,
54 | VariantProps {}
55 |
56 | const SheetContent = React.forwardRef<
57 | React.ElementRef,
58 | SheetContentProps
59 | >(({ side = "right", className, children, ...props }, ref) => (
60 |
61 |
67 | {children}
68 |
69 | Close
71 |
72 |
73 |
74 | ))
75 | SheetContent.displayName = SheetPrimitive.Content.displayName
76 |
77 | const SheetHeader = ({
78 | className,
79 | ...props
80 | }: React.HTMLAttributes) => (
81 |
88 | )
89 | SheetHeader.displayName = "SheetHeader"
90 |
91 | const SheetFooter = ({
92 | className,
93 | ...props
94 | }: React.HTMLAttributes) => (
95 |
102 | )
103 | SheetFooter.displayName = "SheetFooter"
104 |
105 | const SheetTitle = React.forwardRef<
106 | React.ElementRef,
107 | React.ComponentPropsWithoutRef
108 | >(({ className, ...props }, ref) => (
109 | ,
119 | React.ComponentPropsWithoutRef
120 | >(({ className, ...props }, ref) => (
121 |
18 | 
62 |