@@ -189,7 +187,7 @@ function Sidebar({
className="bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden"
style={
{
- '--sidebar-width': SIDEBAR_WIDTH_MOBILE,
+ "--sidebar-width": SIDEBAR_WIDTH_MOBILE,
} as React.CSSProperties
}
side={side}
@@ -208,7 +206,7 @@ function Sidebar({
@@ -272,13 +270,14 @@ function SidebarTrigger({
}}
{...props}
>
-
+
Toggle Sidebar
)
}
-function SidebarRail({ className, ...props }: React.ComponentProps<'button'>) {
+function SidebarRail({ className, ...props }: React.ComponentProps<"button">) {
const { toggleSidebar } = useSidebar()
return (
@@ -290,26 +289,26 @@ function SidebarRail({ className, ...props }: React.ComponentProps<'button'>) {
onClick={toggleSidebar}
title="Toggle Sidebar"
className={cn(
- 'hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-0.5 sm:flex',
- 'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize',
- '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',
- 'hover:group-data-[collapsible=offExamples]:bg-sidebar group-data-[collapsible=offExamples]:translate-x-0 group-data-[collapsible=offExamples]:after:left-full',
- '[[data-side=left][data-collapsible=offExamples]_&]:-right-2',
- '[[data-side=right][data-collapsible=offExamples]_&]:-left-2',
- className,
+ "hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex",
+ "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
+ "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+ "hover:group-data-[collapsible=offExamples]:bg-sidebar group-data-[collapsible=offExamples]:translate-x-0 group-data-[collapsible=offExamples]:after:left-full",
+ "[[data-side=left][data-collapsible=offExamples]_&]:-right-2",
+ "[[data-side=right][data-collapsible=offExamples]_&]:-left-2",
+ className
)}
{...props}
/>
)
}
-function SidebarInset({ className, ...props }: React.ComponentProps<'main'>) {
+function SidebarInset({ className, ...props }: React.ComponentProps<"main">) {
return (
@@ -324,32 +323,29 @@ function SidebarInput({
)
}
-function SidebarHeader({ className, ...props }: React.ComponentProps<'div'>) {
+function SidebarHeader({ className, ...props }: React.ComponentProps<"div">) {
return (
)
}
-function SidebarFooter({ className, ...props }: React.ComponentProps<'div'>) {
+function SidebarFooter({ className, ...props }: React.ComponentProps<"div">) {
return (
)
@@ -363,34 +359,34 @@ function SidebarSeparator({
)
}
-function SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {
+function SidebarContent({ className, ...props }: React.ComponentProps<"div">) {
return (
)
}
-function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {
+function SidebarGroup({ className, ...props }: React.ComponentProps<"div">) {
return (
@@ -399,146 +395,133 @@ function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {
function SidebarGroupLabel({
className,
- render,
+ asChild = false,
...props
-}: useRender.ComponentProps<'div'> & React.ComponentProps<'div'>) {
- return useRender({
- defaultTagName: 'div',
- props: mergeProps<'div'>(
- {
- className: cn(
- 'text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 flex shrink-0 items-center outline-hidden [&>svg]:shrink-0',
- className,
- ),
- },
- props,
- ),
- render,
- state: {
- slot: 'sidebar-group-label',
- sidebar: 'group-label',
- },
- })
+}: React.ComponentProps<"div"> & { asChild?: boolean }) {
+ const Comp = asChild ? Slot.Root : "div"
+
+ return (
+
svg]:size-4 flex shrink-0 items-center outline-hidden [&>svg]:shrink-0",
+ className
+ )}
+ {...props}
+ />
+ )
}
function SidebarGroupAction({
className,
- render,
+ asChild = false,
...props
-}: useRender.ComponentProps<'button'> & React.ComponentProps<'button'>) {
- return useRender({
- defaultTagName: 'button',
- props: mergeProps<'button'>(
- {
- className: cn(
- 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 w-5 rounded-md p-0 focus-visible:ring-2 [&>svg]:size-4 flex aspect-square items-center justify-center outline-hidden transition-transform [&>svg]:shrink-0 after:absolute after:-inset-2 md:after:hidden group-data-[collapsible=icon]:hidden',
- className,
- ),
- },
- props,
- ),
- render,
- state: {
- slot: 'sidebar-group-action',
- sidebar: 'group-action',
- },
- })
+}: React.ComponentProps<"button"> & { asChild?: boolean }) {
+ const Comp = asChild ? Slot.Root : "button"
+
+ return (
+ svg]:size-4 flex aspect-square items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>svg]:shrink-0",
+ className
+ )}
+ {...props}
+ />
+ )
}
function SidebarGroupContent({
className,
...props
-}: React.ComponentProps<'div'>) {
+}: React.ComponentProps<"div">) {
return (
)
}
-function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {
+function SidebarMenu({ className, ...props }: React.ComponentProps<"ul">) {
return (
)
}
-function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {
+function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">) {
return (
)
}
const sidebarMenuButtonVariants = cva(
- 'ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-[calc(var(--radius-sm)+2px)] p-2 text-left text-xs transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium peer/menu-button flex w-full items-center overflow-hidden outline-hidden group/menu-button disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&_svg]:size-4 [&_svg]:shrink-0',
+ "ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-[calc(var(--radius-sm)+2px)] p-2 text-left text-xs transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium peer/menu-button flex w-full items-center overflow-hidden outline-hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&_svg]:size-4 [&_svg]:shrink-0",
{
variants: {
variant: {
- default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
- outline:
- 'bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',
+ default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+ outline: "bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]",
},
size: {
- default: 'h-8 text-xs',
- sm: 'h-7 text-xs',
- lg: 'h-12 text-xs group-data-[collapsible=icon]:p-0!',
+ default: "h-8 text-xs",
+ sm: "h-7 text-xs",
+ lg: "h-12 text-xs group-data-[collapsible=icon]:p-0!",
},
},
defaultVariants: {
- variant: 'default',
- size: 'default',
+ variant: "default",
+ size: "default",
},
- },
+ }
)
function SidebarMenuButton({
- render,
+ asChild = false,
isActive = false,
- variant = 'default',
- size = 'default',
+ variant = "default",
+ size = "default",
tooltip,
className,
...props
-}: useRender.ComponentProps<'button'> &
- React.ComponentProps<'button'> & {
- isActive?: boolean
- tooltip?: string | React.ComponentProps
- } & VariantProps) {
+}: React.ComponentProps<"button"> & {
+ asChild?: boolean
+ isActive?: boolean
+ tooltip?: string | React.ComponentProps
+} & VariantProps) {
+ const Comp = asChild ? Slot.Root : "button"
const { isMobile, state } = useSidebar()
- const comp = useRender({
- defaultTagName: 'button',
- props: mergeProps<'button'>(
- {
- className: cn(sidebarMenuButtonVariants({ variant, size }), className),
- },
- props,
- ),
- render: !tooltip ? render : TooltipTrigger,
- state: {
- slot: 'sidebar-menu-button',
- sidebar: 'menu-button',
- size,
- active: isActive,
- },
- })
+
+ const button = (
+
+ )
if (!tooltip) {
- return comp
+ return button
}
- if (typeof tooltip === 'string') {
+ if (typeof tooltip === "string") {
tooltip = {
children: tooltip,
}
@@ -546,11 +529,11 @@ function SidebarMenuButton({
return (
- {comp}
+ {button}
@@ -559,45 +542,41 @@ function SidebarMenuButton({
function SidebarMenuAction({
className,
- render,
+ asChild = false,
showOnHover = false,
...props
-}: useRender.ComponentProps<'button'> &
- React.ComponentProps<'button'> & {
- showOnHover?: boolean
- }) {
- return useRender({
- defaultTagName: 'button',
- props: mergeProps<'button'>(
- {
- className: cn(
- 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 aspect-square w-5 rounded-[calc(var(--radius-sm)-2px)] p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>svg]:size-4 flex items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>svg]:shrink-0',
- showOnHover &&
- 'peer-data-active/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-open:opacity-100 md:opacity-0',
- className,
- ),
- },
- props,
- ),
- render,
- state: {
- slot: 'sidebar-menu-action',
- sidebar: 'menu-action',
- },
- })
+}: React.ComponentProps<"button"> & {
+ asChild?: boolean
+ showOnHover?: boolean
+}) {
+ const Comp = asChild ? Slot.Root : "button"
+
+ return (
+ svg]:size-4 flex items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>svg]:shrink-0",
+ showOnHover &&
+ "peer-data-active/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-open:opacity-100 md:opacity-0",
+ className
+ )}
+ {...props}
+ />
+ )
}
function SidebarMenuBadge({
className,
...props
-}: React.ComponentProps<'div'>) {
+}: React.ComponentProps<"div">) {
return (
@@ -608,7 +587,7 @@ function SidebarMenuSkeleton({
className,
showIcon = false,
...props
-}: React.ComponentProps<'div'> & {
+}: React.ComponentProps<"div"> & {
showIcon?: boolean
}) {
// Random width between 50 to 90%.
@@ -620,7 +599,7 @@ function SidebarMenuSkeleton({
{showIcon && (
@@ -634,7 +613,7 @@ function SidebarMenuSkeleton({
data-sidebar="menu-skeleton-text"
style={
{
- '--skeleton-width': width,
+ "--skeleton-width": width,
} as React.CSSProperties
}
/>
@@ -642,15 +621,12 @@ function SidebarMenuSkeleton({
)
}
-function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {
+function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">) {
return (
)
@@ -659,47 +635,43 @@ function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {
function SidebarMenuSubItem({
className,
...props
-}: React.ComponentProps<'li'>) {
+}: React.ComponentProps<"li">) {
return (
)
}
function SidebarMenuSubButton({
- render,
- size = 'md',
+ asChild = false,
+ size = "md",
isActive = false,
className,
...props
-}: useRender.ComponentProps<'a'> &
- React.ComponentProps<'a'> & {
- size?: 'sm' | 'md'
- isActive?: boolean
- }) {
- return useRender({
- defaultTagName: 'a',
- props: mergeProps<'a'>(
- {
- className: cn(
- 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 focus-visible:ring-2 data-[size=md]:text-xs data-[size=sm]:text-xs [&>svg]:size-4 flex min-w-0 -translate-x-px items-center overflow-hidden outline-hidden group-data-[collapsible=icon]:hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:shrink-0',
- className,
- ),
- },
- props,
- ),
- render,
- state: {
- slot: 'sidebar-menu-sub-button',
- sidebar: 'menu-sub-button',
- size,
- active: isActive,
- },
- })
+}: React.ComponentProps<"a"> & {
+ asChild?: boolean
+ size?: "sm" | "md"
+ isActive?: boolean
+}) {
+ const Comp = asChild ? Slot.Root : "a"
+
+ return (
+
svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 focus-visible:ring-2 data-[size=md]:text-xs data-[size=sm]:text-xs [&>svg]:size-4 flex min-w-0 -translate-x-px items-center overflow-hidden outline-hidden group-data-[collapsible=icon]:hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:shrink-0",
+ className
+ )}
+ {...props}
+ />
+ )
}
export {
diff --git a/src/components/ui/sonner.tsx b/src/components/ui/sonner.tsx
index bd6eb71..a9fec31 100644
--- a/src/components/ui/sonner.tsx
+++ b/src/components/ui/sonner.tsx
@@ -1,7 +1,6 @@
import { useTheme } from "next-themes"
import { Toaster as Sonner, type ToasterProps } from "sonner"
-import { HugeiconsIcon } from "@hugeicons/react"
-import { CheckmarkCircle02Icon, InformationCircleIcon, Alert02Icon, MultiplicationSignCircleIcon, Loading03Icon } from "@hugeicons/core-free-icons"
+import { CheckCircleIcon, InfoIcon, WarningIcon, XCircleIcon, SpinnerIcon } from "@phosphor-icons/react"
const Toaster = ({ ...props }: ToasterProps) => {
const { theme = "system" } = useTheme()
@@ -12,19 +11,19 @@ const Toaster = ({ ...props }: ToasterProps) => {
className="toaster group"
icons={{
success: (
-
+
),
info: (
-
+
),
warning: (
-
+
),
error: (
-
+
),
loading: (
-
+
),
}}
style={
diff --git a/src/components/ui/tooltip.tsx b/src/components/ui/tooltip.tsx
index 4e99106..f374c0b 100644
--- a/src/components/ui/tooltip.tsx
+++ b/src/components/ui/tooltip.tsx
@@ -1,23 +1,26 @@
"use client"
-import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip"
+import { Tooltip as TooltipPrimitive } from 'radix-ui'
+import * as React from 'react'
import { cn } from "@/lib/utils"
function TooltipProvider({
- delay = 0,
+ delayDuration = 0,
...props
-}: TooltipPrimitive.Provider.Props) {
+}: React.ComponentProps) {
return (
)
}
-function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
+function Tooltip({
+ ...props
+}: React.ComponentProps) {
return (
@@ -25,46 +28,34 @@ function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
)
}
-function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
+function TooltipTrigger({
+ ...props
+}: React.ComponentProps) {
return
}
function TooltipContent({
className,
- side = "top",
- sideOffset = 4,
- align = "center",
- alignOffset = 0,
+ sideOffset = 0,
children,
...props
-}: TooltipPrimitive.Popup.Props &
- Pick<
- TooltipPrimitive.Positioner.Props,
- "align" | "alignOffset" | "side" | "sideOffset"
- >) {
+}: React.ComponentProps) {
return (
-
-
- {children}
-
-
-
+ {children}
+
+
)
}
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
+export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }
diff --git a/src/lib/auth.ts b/src/lib/auth.ts
index c250339..35e8100 100644
--- a/src/lib/auth.ts
+++ b/src/lib/auth.ts
@@ -1,14 +1,27 @@
-import { betterAuth } from 'better-auth'
-import { admin as adminPlugin, organization } from 'better-auth/plugins'
-import { prismaAdapter } from 'better-auth/adapters/prisma'
-import { prisma } from '@/db'
-import { ac, admin, user } from '@/lib/auth/permissions'
+import { prisma } from '@/db';
+import { User } from '@/generated/prisma/client';
+import { SessionModel } from '@/generated/prisma/models';
import {
acOrg,
adminOrg,
member,
owner,
-} from '@/lib/auth/organization-permissions'
+} from '@/lib/auth/organization-permissions';
+import { ac, admin, user } from '@/lib/auth/permissions';
+import { betterAuth } from 'better-auth';
+import { prismaAdapter } from 'better-auth/adapters/prisma';
+import { admin as adminPlugin, organization } from 'better-auth/plugins';
+
+// export interface User {
+// image?: string | null;
+// name?: string | null;
+// email?: string | null;
+// }
+
+export interface Session {
+ session: SessionModel | null | undefined;
+ user?: User;
+}
export const auth = betterAuth({
database: prismaAdapter(prisma, {
@@ -52,9 +65,9 @@ export const auth = betterAuth({
userId: user.id,
color: '#000000',
},
- })
+ });
},
},
},
},
-})
+});
diff --git a/src/lib/auth/session.ts b/src/lib/auth/session.ts
index c7295ad..2f2fd4f 100644
--- a/src/lib/auth/session.ts
+++ b/src/lib/auth/session.ts
@@ -1,11 +1,13 @@
-import { createServerFn } from '@tanstack/react-start'
-import { getRequestHeaders } from '@tanstack/react-start/server'
-import { auth } from '../auth'
+import { createServerFn } from '@tanstack/react-start';
+import { getRequestHeaders } from '@tanstack/react-start/server';
+import { auth } from '../auth';
+
+export type Session = typeof auth.$Infer.Session;
export const getSession = createServerFn({ method: 'GET' }).handler(
async () => {
- const headers = getRequestHeaders()
- const session = await auth.api.getSession({ headers })
- return session
+ const headers = getRequestHeaders();
+ const session = await auth.api.getSession({ headers });
+ return session;
},
-)
+);
diff --git a/src/locales/vi.json b/src/locales/vi.json
index 97d8d85..3bb489f 100644
--- a/src/locales/vi.json
+++ b/src/locales/vi.json
@@ -11,8 +11,11 @@
"confirm_btn": "Xác nhận",
"signup_btn": "Đăng ký",
"view_btn": "Xem",
+ "save_btn": "Lưu",
+ "update_btn": "Cập nhật",
"view_all_notifications": "Xem tất cả thông báo",
- "label_notifications": "Thông báo"
+ "label_notifications": "Thông báo",
+ "change_password_btn": "Đổi mật khẩu"
},
"header": {
"Administration": "Quản lý",
@@ -31,7 +34,8 @@
"log": "Lịch sử",
"roles": "Vai trò & quyền hạn",
"box": "Hộp chứa",
- "account": "Tài khoản"
+ "account": "Tài khoản",
+ "profile": "Hồ sơ"
},
"loginPage": {
"form": {
@@ -50,13 +54,43 @@
"email_invalid": "Email không đúng định dạng!"
}
},
- "SignUpPage": {
+ "signUpPage": {
"form": {},
"ui": {
+ "title": "Đăng ký",
"create_account": "Tạo tài khoản"
},
"messages": {}
},
+ "changePassword": {
+ "form": {
+ "current_password": "Mật khẩu hiện tại",
+ "new_password": "Mật khẩu mới",
+ "confirm_password": "Nhập lại mật khẩu mới"
+ },
+ "ui": {
+ "title": "Đổi mật khẩu"
+ },
+ "messages": {
+ "is_required": "{{field}} là bắt buộc.",
+ "password_not_match": "Mật khẩu không khớp",
+ "change_password_success": "Đổi mật khẩu thành công!"
+ }
+ },
+ "profile": {
+ "form": {
+ "name": "Tên",
+ "email": "Email",
+ "role": "Vai trò"
+ },
+ "ui": {
+ "title": "Hồ sơ"
+ },
+ "messages": {
+ "is_required": "{{field}} là bắt buộc.",
+ "update_success": "Cập nhật thành công!"
+ }
+ },
"kanri": {
"settings": "Cài đặt",
"settings_desc": "Cài đặt hệ thống.",
@@ -232,6 +266,7 @@
"page_show": "{count, selectordinal, =1 {Hiện chỉ có # vai trò} other {Hiển thị {start} tới {end} của # hộp}}"
},
"backend": {
- "INVALID_EMAIL_OR_PASSWORD": "Email hoặc mật khẩu không đúng!"
+ "INVALID_EMAIL_OR_PASSWORD": "Email hoặc mật khẩu không đúng!",
+ "INVALID_PASSWORD": "Mật khẩu hiện tại không đúng!"
}
}
diff --git a/src/logo.svg b/src/logo.svg
deleted file mode 100644
index fe53fe8..0000000
--- a/src/logo.svg
+++ /dev/null
@@ -1,12 +0,0 @@
-
-
\ No newline at end of file
diff --git a/src/routeTree.gen.ts b/src/routeTree.gen.ts
index 780cf6f..920186e 100644
--- a/src/routeTree.gen.ts
+++ b/src/routeTree.gen.ts
@@ -13,8 +13,11 @@ import { Route as appRouteRouteImport } from './routes/(app)/route'
import { Route as appIndexRouteImport } from './routes/(app)/index'
import { Route as authSignUpRouteImport } from './routes/(auth)/sign-up'
import { Route as authSignInRouteImport } from './routes/(auth)/sign-in'
-import { Route as appDashboardRouteImport } from './routes/(app)/dashboard'
+import { Route as appauthRouteRouteImport } from './routes/(app)/(auth)/route'
import { Route as ApiAuthSplatRouteImport } from './routes/api/auth.$'
+import { Route as appauthProfileRouteImport } from './routes/(app)/(auth)/profile'
+import { Route as appauthDashboardRouteImport } from './routes/(app)/(auth)/dashboard'
+import { Route as appauthChangePasswordRouteImport } from './routes/(app)/(auth)/change-password'
const appRouteRoute = appRouteRouteImport.update({
id: '/(app)',
@@ -35,9 +38,8 @@ const authSignInRoute = authSignInRouteImport.update({
path: '/sign-in',
getParentRoute: () => rootRouteImport,
} as any)
-const appDashboardRoute = appDashboardRouteImport.update({
- id: '/dashboard',
- path: '/dashboard',
+const appauthRouteRoute = appauthRouteRouteImport.update({
+ id: '/(auth)',
getParentRoute: () => appRouteRoute,
} as any)
const ApiAuthSplatRoute = ApiAuthSplatRouteImport.update({
@@ -45,42 +47,81 @@ const ApiAuthSplatRoute = ApiAuthSplatRouteImport.update({
path: '/api/auth/$',
getParentRoute: () => rootRouteImport,
} as any)
+const appauthProfileRoute = appauthProfileRouteImport.update({
+ id: '/profile',
+ path: '/profile',
+ getParentRoute: () => appauthRouteRoute,
+} as any)
+const appauthDashboardRoute = appauthDashboardRouteImport.update({
+ id: '/dashboard',
+ path: '/dashboard',
+ getParentRoute: () => appauthRouteRoute,
+} as any)
+const appauthChangePasswordRoute = appauthChangePasswordRouteImport.update({
+ id: '/change-password',
+ path: '/change-password',
+ getParentRoute: () => appauthRouteRoute,
+} as any)
export interface FileRoutesByFullPath {
- '/dashboard': typeof appDashboardRoute
'/sign-in': typeof authSignInRoute
'/sign-up': typeof authSignUpRoute
'/': typeof appIndexRoute
+ '/change-password': typeof appauthChangePasswordRoute
+ '/dashboard': typeof appauthDashboardRoute
+ '/profile': typeof appauthProfileRoute
'/api/auth/$': typeof ApiAuthSplatRoute
}
export interface FileRoutesByTo {
- '/dashboard': typeof appDashboardRoute
'/sign-in': typeof authSignInRoute
'/sign-up': typeof authSignUpRoute
'/': typeof appIndexRoute
+ '/change-password': typeof appauthChangePasswordRoute
+ '/dashboard': typeof appauthDashboardRoute
+ '/profile': typeof appauthProfileRoute
'/api/auth/$': typeof ApiAuthSplatRoute
}
export interface FileRoutesById {
__root__: typeof rootRouteImport
'/(app)': typeof appRouteRouteWithChildren
- '/(app)/dashboard': typeof appDashboardRoute
+ '/(app)/(auth)': typeof appauthRouteRouteWithChildren
'/(auth)/sign-in': typeof authSignInRoute
'/(auth)/sign-up': typeof authSignUpRoute
'/(app)/': typeof appIndexRoute
+ '/(app)/(auth)/change-password': typeof appauthChangePasswordRoute
+ '/(app)/(auth)/dashboard': typeof appauthDashboardRoute
+ '/(app)/(auth)/profile': typeof appauthProfileRoute
'/api/auth/$': typeof ApiAuthSplatRoute
}
export interface FileRouteTypes {
fileRoutesByFullPath: FileRoutesByFullPath
- fullPaths: '/dashboard' | '/sign-in' | '/sign-up' | '/' | '/api/auth/$'
+ fullPaths:
+ | '/sign-in'
+ | '/sign-up'
+ | '/'
+ | '/change-password'
+ | '/dashboard'
+ | '/profile'
+ | '/api/auth/$'
fileRoutesByTo: FileRoutesByTo
- to: '/dashboard' | '/sign-in' | '/sign-up' | '/' | '/api/auth/$'
+ to:
+ | '/sign-in'
+ | '/sign-up'
+ | '/'
+ | '/change-password'
+ | '/dashboard'
+ | '/profile'
+ | '/api/auth/$'
id:
| '__root__'
| '/(app)'
- | '/(app)/dashboard'
+ | '/(app)/(auth)'
| '/(auth)/sign-in'
| '/(auth)/sign-up'
| '/(app)/'
+ | '/(app)/(auth)/change-password'
+ | '/(app)/(auth)/dashboard'
+ | '/(app)/(auth)/profile'
| '/api/auth/$'
fileRoutesById: FileRoutesById
}
@@ -121,11 +162,11 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof authSignInRouteImport
parentRoute: typeof rootRouteImport
}
- '/(app)/dashboard': {
- id: '/(app)/dashboard'
- path: '/dashboard'
- fullPath: '/dashboard'
- preLoaderRoute: typeof appDashboardRouteImport
+ '/(app)/(auth)': {
+ id: '/(app)/(auth)'
+ path: ''
+ fullPath: ''
+ preLoaderRoute: typeof appauthRouteRouteImport
parentRoute: typeof appRouteRoute
}
'/api/auth/$': {
@@ -135,16 +176,53 @@ declare module '@tanstack/react-router' {
preLoaderRoute: typeof ApiAuthSplatRouteImport
parentRoute: typeof rootRouteImport
}
+ '/(app)/(auth)/profile': {
+ id: '/(app)/(auth)/profile'
+ path: '/profile'
+ fullPath: '/profile'
+ preLoaderRoute: typeof appauthProfileRouteImport
+ parentRoute: typeof appauthRouteRoute
+ }
+ '/(app)/(auth)/dashboard': {
+ id: '/(app)/(auth)/dashboard'
+ path: '/dashboard'
+ fullPath: '/dashboard'
+ preLoaderRoute: typeof appauthDashboardRouteImport
+ parentRoute: typeof appauthRouteRoute
+ }
+ '/(app)/(auth)/change-password': {
+ id: '/(app)/(auth)/change-password'
+ path: '/change-password'
+ fullPath: '/change-password'
+ preLoaderRoute: typeof appauthChangePasswordRouteImport
+ parentRoute: typeof appauthRouteRoute
+ }
}
}
+interface appauthRouteRouteChildren {
+ appauthChangePasswordRoute: typeof appauthChangePasswordRoute
+ appauthDashboardRoute: typeof appauthDashboardRoute
+ appauthProfileRoute: typeof appauthProfileRoute
+}
+
+const appauthRouteRouteChildren: appauthRouteRouteChildren = {
+ appauthChangePasswordRoute: appauthChangePasswordRoute,
+ appauthDashboardRoute: appauthDashboardRoute,
+ appauthProfileRoute: appauthProfileRoute,
+}
+
+const appauthRouteRouteWithChildren = appauthRouteRoute._addFileChildren(
+ appauthRouteRouteChildren,
+)
+
interface appRouteRouteChildren {
- appDashboardRoute: typeof appDashboardRoute
+ appauthRouteRoute: typeof appauthRouteRouteWithChildren
appIndexRoute: typeof appIndexRoute
}
const appRouteRouteChildren: appRouteRouteChildren = {
- appDashboardRoute: appDashboardRoute,
+ appauthRouteRoute: appauthRouteRouteWithChildren,
appIndexRoute: appIndexRoute,
}
diff --git a/src/router.tsx b/src/router.tsx
index 088fbd6..7a052f4 100644
--- a/src/router.tsx
+++ b/src/router.tsx
@@ -3,8 +3,15 @@ import { setupRouterSsrQueryIntegration } from '@tanstack/react-router-ssr-query
import * as TanstackQuery from './integrations/tanstack-query/root-provider'
// Import the generated route tree
+import { BreadcrumbValue } from './components/sidebar/RouterBreadcrumb'
import { routeTree } from './routeTree.gen'
+declare module '@tanstack/react-router' {
+ interface StaticDataRouteOption {
+ breadcrumb?: BreadcrumbValue
+ }
+}
+
// Create a new router instance
export const getRouter = () => {
const rqContext = TanstackQuery.getContext()
diff --git a/src/routes/(app)/(auth)/change-password.tsx b/src/routes/(app)/(auth)/change-password.tsx
new file mode 100644
index 0000000..823ce77
--- /dev/null
+++ b/src/routes/(app)/(auth)/change-password.tsx
@@ -0,0 +1,18 @@
+import ChangePasswordForm from '@/components/form/change-password-form'
+import i18n from '@/lib/i18n'
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/(app)/(auth)/change-password')({
+ component: RouteComponent,
+ staticData: { breadcrumb: i18n.t('nav.change_password') },
+})
+
+function RouteComponent() {
+ return (
+
+ )
+}
diff --git a/src/routes/(app)/(auth)/dashboard.tsx b/src/routes/(app)/(auth)/dashboard.tsx
new file mode 100644
index 0000000..effcc91
--- /dev/null
+++ b/src/routes/(app)/(auth)/dashboard.tsx
@@ -0,0 +1,9 @@
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/(app)/(auth)/dashboard')({
+ component: RouteComponent,
+})
+
+function RouteComponent() {
+ return Hello "/(app)/dashboard"!
+}
diff --git a/src/routes/(app)/(auth)/profile.tsx b/src/routes/(app)/(auth)/profile.tsx
new file mode 100644
index 0000000..f0554e4
--- /dev/null
+++ b/src/routes/(app)/(auth)/profile.tsx
@@ -0,0 +1,18 @@
+import ProfileForm from '@/components/form/profile-form'
+import i18n from '@/lib/i18n'
+import { createFileRoute } from '@tanstack/react-router'
+
+export const Route = createFileRoute('/(app)/(auth)/profile')({
+ component: RouteComponent,
+ staticData: { breadcrumb: i18n.t('nav.profile') },
+})
+
+function RouteComponent() {
+ return (
+
+ )
+}
diff --git a/src/routes/(app)/dashboard.tsx b/src/routes/(app)/(auth)/route.tsx
similarity index 62%
rename from src/routes/(app)/dashboard.tsx
rename to src/routes/(app)/(auth)/route.tsx
index cd5a4d3..ce26c8d 100644
--- a/src/routes/(app)/dashboard.tsx
+++ b/src/routes/(app)/(auth)/route.tsx
@@ -1,7 +1,7 @@
import { authMiddleware } from '@/lib/middleware'
-import { createFileRoute, redirect } from '@tanstack/react-router'
+import { createFileRoute, Outlet, redirect } from '@tanstack/react-router'
-export const Route = createFileRoute('/(app)/dashboard')({
+export const Route = createFileRoute('/(app)/(auth)')({
beforeLoad: async ({ context }) => {
if (!context.userSession) {
throw redirect({ to: '/sign-in' })
@@ -14,5 +14,5 @@ export const Route = createFileRoute('/(app)/dashboard')({
})
function RouteComponent() {
- return Hello "/(app)/dashboard"!
+ return
}
diff --git a/src/routes/(app)/index.tsx b/src/routes/(app)/index.tsx
index 0aad766..e931720 100644
--- a/src/routes/(app)/index.tsx
+++ b/src/routes/(app)/index.tsx
@@ -1,6 +1,10 @@
+import i18n from '@/lib/i18n'
import { createFileRoute } from '@tanstack/react-router'
-export const Route = createFileRoute('/(app)/')({ component: App })
+export const Route = createFileRoute('/(app)/')({
+ component: App,
+ staticData: { breadcrumb: i18n.t('nav.home') },
+})
function App() {
return Home
diff --git a/src/routes/(app)/route.tsx b/src/routes/(app)/route.tsx
index 91179e3..624fc86 100644
--- a/src/routes/(app)/route.tsx
+++ b/src/routes/(app)/route.tsx
@@ -11,7 +11,7 @@ export const Route = createFileRoute('/(app)')({
function RouteComponent() {
return (
-
+
diff --git a/src/routes/(auth)/sign-in.tsx b/src/routes/(auth)/sign-in.tsx
index f0f6c19..c19b92d 100644
--- a/src/routes/(auth)/sign-in.tsx
+++ b/src/routes/(auth)/sign-in.tsx
@@ -1,4 +1,4 @@
-import SignInForm from '@/components/signin-form'
+import SignInForm from '@/components/form/signin-form'
import { createFileRoute } from '@tanstack/react-router'
export const Route = createFileRoute('/(auth)/sign-in')({
diff --git a/src/routes/(auth)/sign-up.tsx b/src/routes/(auth)/sign-up.tsx
index 179ca2d..655253b 100644
--- a/src/routes/(auth)/sign-up.tsx
+++ b/src/routes/(auth)/sign-up.tsx
@@ -1,4 +1,4 @@
-import SignupForm from '@/components/signup-form'
+import SignupForm from '@/components/form/signup-form'
import { createFileRoute } from '@tanstack/react-router'
export const Route = createFileRoute('/(auth)/sign-up')({
diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx
index 2317a76..020932e 100644
--- a/src/routes/__root.tsx
+++ b/src/routes/__root.tsx
@@ -1,25 +1,25 @@
+import NotFound from '@/components/NotFound'
+import { Toaster } from '@/components/ui/sonner'
+import { sessionQueryOptions } from '@/hooks/use-session'
+import { setSSRLanguage } from '@/lib/i18n'
+import {
+ CheckIcon,
+ InfoIcon,
+ WarningIcon,
+ WarningOctagonIcon,
+} from '@phosphor-icons/react'
import { TanStackDevtools } from '@tanstack/react-devtools'
+import type { QueryClient } from '@tanstack/react-query'
import {
HeadContent,
Scripts,
createRootRouteWithContext,
} from '@tanstack/react-router'
import { TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'
+import React from 'react'
+import { useTranslation } from 'react-i18next'
import TanStackQueryDevtools from '../integrations/tanstack-query/devtools'
import appCss from '../styles.css?url'
-import type { QueryClient } from '@tanstack/react-query'
-import React from 'react'
-import { setSSRLanguage } from '@/lib/i18n'
-import { useTranslation } from 'react-i18next'
-import { Toaster } from '@/components/ui/sonner'
-import { HugeiconsIcon } from '@hugeicons/react'
-import {
- Alert02Icon,
- AlertCircleIcon,
- CheckmarkCircle01Icon,
- InformationCircleIcon,
-} from '@hugeicons/core-free-icons'
-import { sessionQueryOptions } from '@/hooks/use-session'
interface MyRouterContext {
queryClient: QueryClient
@@ -44,6 +44,9 @@ export const Route = createRootRouteWithContext()({
{
title: 'Fuware',
},
+ {
+ description: 'Fuware is a platform for managing your business.',
+ },
],
links: [
{
@@ -53,7 +56,7 @@ export const Route = createRootRouteWithContext()({
],
}),
shellComponent: RootDocument,
- notFoundComponent: () => 404 Not Found
,
+ notFoundComponent: () => ,
})
function RootDocument({ children }: { children: React.ReactNode }) {
@@ -80,34 +83,10 @@ function RootDocument({ children }: { children: React.ReactNode }) {
},
}}
icons={{
- success: (
-
- ),
- error: (
-
- ),
- info: (
-
- ),
- warning: (
-
- ),
+ success: ,
+ error: ,
+ info: ,
+ warning: ,
}}
/>
diff --git a/src/server/profile-service.ts b/src/server/profile-service.ts
new file mode 100644
index 0000000..26ad5cc
--- /dev/null
+++ b/src/server/profile-service.ts
@@ -0,0 +1,17 @@
+import { authMiddleware } from '@/lib/middleware'
+import { saveFile } from '@/utils/disk-storage'
+import { createServerFn } from '@tanstack/react-start'
+import z from 'zod'
+
+export const uploadProfileImage = createServerFn({ method: 'POST' })
+ .middleware([authMiddleware])
+ .inputValidator(z.instanceof(FormData))
+ .handler(async ({ data: formData }) => {
+ const uuid = crypto.randomUUID()
+ const file = formData.get('file') as File
+ if (!(file instanceof File)) throw new Error('File not found')
+ const imageKey = `${uuid}.${file.type.split('/')[1]}`
+ const buffer = Buffer.from(await file.arrayBuffer())
+ await saveFile(imageKey, buffer)
+ return { imageKey }
+ })
diff --git a/src/styles.css b/src/styles.css
index d4661da..8b9d0bc 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -19,13 +19,13 @@ code {
:root {
--background: oklch(1 0 0);
- --foreground: oklch(0.13 0.028 261.692);
+ --foreground: oklch(0.147 0.004 49.25);
--card: oklch(1 0 0);
- --card-foreground: oklch(0.13 0.028 261.692);
+ --card-foreground: oklch(0.147 0.004 49.25);
--popover: oklch(1 0 0);
- --popover-foreground: oklch(0.13 0.028 261.692);
- --primary: oklch(0.61 0.11 222);
- --primary-foreground: oklch(0.98 0.02 201);
+ --popover-foreground: oklch(0.147 0.004 49.25);
+ --primary: oklch(0.646 0.222 41.116);
+ --primary-foreground: oklch(0.98 0.016 73.684);
--secondary: oklch(0.967 0.001 286.375);
--secondary-foreground: oklch(0.21 0.006 285.885);
--muted: oklch(0.967 0.003 264.542);
@@ -34,34 +34,34 @@ code {
--accent-foreground: oklch(0.21 0.034 264.665);
--destructive: oklch(0.577 0.245 27.325);
--destructive-foreground: oklch(0.577 0.245 27.325);
- --border: oklch(0.928 0.006 264.531);
- --input: oklch(0.928 0.006 264.531);
- --ring: oklch(0.707 0.022 261.325);
- --chart-1: oklch(0.87 0.12 207);
- --chart-2: oklch(0.80 0.13 212);
- --chart-3: oklch(0.71 0.13 215);
- --chart-4: oklch(0.61 0.11 222);
- --chart-5: oklch(0.52 0.09 223);
+ --border: oklch(0.923 0.003 48.717);
+ --input: oklch(0.923 0.003 48.717);
+ --ring: oklch(0.709 0.01 56.259);
+ --chart-1: oklch(0.837 0.128 66.29);
+ --chart-2: oklch(0.705 0.213 47.604);
+ --chart-3: oklch(0.646 0.222 41.116);
+ --chart-4: oklch(0.553 0.195 38.402);
+ --chart-5: oklch(0.47 0.157 37.304);
--radius: 0.625rem;
- --sidebar: oklch(0.985 0.002 247.839);
- --sidebar-foreground: oklch(0.13 0.028 261.692);
- --sidebar-primary: oklch(0.61 0.11 222);
- --sidebar-primary-foreground: oklch(0.98 0.02 201);
+ --sidebar: oklch(0.985 0.001 106.423);
+ --sidebar-foreground: oklch(0.147 0.004 49.25);
+ --sidebar-primary: oklch(0.646 0.222 41.116);
+ --sidebar-primary-foreground: oklch(0.98 0.016 73.684);
--sidebar-accent: oklch(0.967 0.003 264.542);
--sidebar-accent-foreground: oklch(0.21 0.034 264.665);
- --sidebar-border: oklch(0.928 0.006 264.531);
- --sidebar-ring: oklch(0.707 0.022 261.325);
+ --sidebar-border: oklch(0.923 0.003 48.717);
+ --sidebar-ring: oklch(0.709 0.01 56.259);
}
.dark {
- --background: oklch(0.13 0.028 261.692);
- --foreground: oklch(0.985 0.002 247.839);
- --card: oklch(0.21 0.034 264.665);
- --card-foreground: oklch(0.985 0.002 247.839);
- --popover: oklch(0.21 0.034 264.665);
- --popover-foreground: oklch(0.985 0.002 247.839);
- --primary: oklch(0.71 0.13 215);
- --primary-foreground: oklch(0.30 0.05 230);
+ --background: oklch(0.147 0.004 49.25);
+ --foreground: oklch(0.985 0.001 106.423);
+ --card: oklch(0.216 0.006 56.043);
+ --card-foreground: oklch(0.985 0.001 106.423);
+ --popover: oklch(0.216 0.006 56.043);
+ --popover-foreground: oklch(0.985 0.001 106.423);
+ --primary: oklch(0.705 0.213 47.604);
+ --primary-foreground: oklch(0.98 0.016 73.684);
--secondary: oklch(0.274 0.006 286.033);
--secondary-foreground: oklch(0.985 0 0);
--muted: oklch(0.278 0.033 256.848);
@@ -69,23 +69,23 @@ code {
--accent: oklch(0.278 0.033 256.848);
--accent-foreground: oklch(0.985 0.002 247.839);
--destructive: oklch(0.704 0.191 22.216);
- --destructive-foreground: oklch(0.637 0.237 25.331);
+ --destructive-foreground: oklch(0.704 0.191 22.216);
--border: oklch(1 0 0 / 10%);
--input: oklch(1 0 0 / 15%);
- --ring: oklch(0.551 0.027 264.364);
- --chart-1: oklch(0.87 0.12 207);
- --chart-2: oklch(0.80 0.13 212);
- --chart-3: oklch(0.71 0.13 215);
- --chart-4: oklch(0.61 0.11 222);
- --chart-5: oklch(0.52 0.09 223);
- --sidebar: oklch(0.21 0.034 264.665);
- --sidebar-foreground: oklch(0.985 0.002 247.839);
- --sidebar-primary: oklch(0.80 0.13 212);
- --sidebar-primary-foreground: oklch(0.30 0.05 230);
- --sidebar-accent: oklch(0.278 0.033 256.848);
- --sidebar-accent-foreground: oklch(0.985 0.002 247.839);
+ --ring: oklch(0.553 0.013 58.071);
+ --chart-1: oklch(0.837 0.128 66.29);
+ --chart-2: oklch(0.705 0.213 47.604);
+ --chart-3: oklch(0.646 0.222 41.116);
+ --chart-4: oklch(0.553 0.195 38.402);
+ --chart-5: oklch(0.47 0.157 37.304);
+ --sidebar: oklch(0.216 0.006 56.043);
+ --sidebar-foreground: oklch(0.985 0.001 106.423);
+ --sidebar-primary: oklch(0.705 0.213 47.604);
+ --sidebar-primary-foreground: oklch(0.98 0.016 73.684);
+ --sidebar-accent: oklch(0.705 0.213 47.604);
+ --sidebar-accent-foreground: oklch(0.98 0.016 73.684);
--sidebar-border: oklch(1 0 0 / 10%);
- --sidebar-ring: oklch(0.551 0.027 264.364);
+ --sidebar-ring: oklch(0.553 0.013 58.071);
}
@theme inline {
@@ -118,6 +118,9 @@ code {
--radius-md: calc(var(--radius) - 2px);
--radius-lg: var(--radius);
--radius-xl: calc(var(--radius) + 4px);
+ --radius-2xl: calc(var(--radius) + 8px);
+ --radius-3xl: calc(var(--radius) + 12px);
+ --radius-4xl: calc(var(--radius) + 16px);
--color-sidebar: var(--sidebar);
--color-sidebar-foreground: var(--sidebar-foreground);
--color-sidebar-primary: var(--sidebar-primary);
diff --git a/src/utils/disk-storage.ts b/src/utils/disk-storage.ts
new file mode 100644
index 0000000..f5ce293
--- /dev/null
+++ b/src/utils/disk-storage.ts
@@ -0,0 +1,25 @@
+import fs, { writeFile } from 'fs/promises'
+import path from 'path'
+
+export async function saveFile(key: string, file: Buffer | File) {
+ const uploadDir = './files'
+ if (!uploadDir) {
+ throw new Error('Upload directory not found')
+ }
+
+ const fileBuffer =
+ file instanceof File ? Buffer.from(await file.arrayBuffer()) : file
+
+ const filePath = path.join(uploadDir, key)
+
+ try {
+ await fs.mkdir(uploadDir, { recursive: true })
+ await writeFile(filePath, fileBuffer)
+ return key
+ } catch (error) {
+ console.error(`Error saving file: ${key}`, error)
+ throw new Error(
+ `Failed to save file: ${error instanceof Error ? error.message : 'Unknown error'}`,
+ )
+ }
+}