From 44af254fe9af2e0fe8798d4dc985efbf1903638a Mon Sep 17 00:00:00 2001 From: Faye Date: Fri, 27 Sep 2024 00:37:50 +0200 Subject: [PATCH] change header to client, move pages, fix mfa --- .../(account)/account/verify/page.tsx | 10 ++++ src/app/[locale]/(account)/layout.tsx | 3 -- .../forgot-password/page.client.tsx | 0 .../forgot-password/page.tsx | 0 src/app/[locale]/(auth)/layout.tsx | 3 -- src/app/[locale]/(auth)/login/mfa/page.tsx | 2 +- src/app/[locale]/(auth)/login/page.client.tsx | 6 +++ src/components/contexts/UserContext.tsx | 2 +- src/components/header/header-resizable.tsx | 50 +++++++++++++++---- src/components/header/header-server.tsx | 31 +----------- src/components/header/mobile-nav.tsx | 8 +-- src/navigation.ts | 1 + 12 files changed, 64 insertions(+), 52 deletions(-) create mode 100644 src/app/[locale]/(account)/account/verify/page.tsx rename src/app/[locale]/{(main) => (auth)}/forgot-password/page.client.tsx (100%) rename src/app/[locale]/{(main) => (auth)}/forgot-password/page.tsx (100%) delete mode 100644 src/app/[locale]/(auth)/layout.tsx diff --git a/src/app/[locale]/(account)/account/verify/page.tsx b/src/app/[locale]/(account)/account/verify/page.tsx new file mode 100644 index 00000000..455555bd --- /dev/null +++ b/src/app/[locale]/(account)/account/verify/page.tsx @@ -0,0 +1,10 @@ +'use client' +import PageLayout from '@/components/pageLayout' + +export default function Page() { + return ( + + Hi, please verify your email. + + ) +} diff --git a/src/app/[locale]/(account)/layout.tsx b/src/app/[locale]/(account)/layout.tsx index b71f5614..680a0c91 100644 --- a/src/app/[locale]/(account)/layout.tsx +++ b/src/app/[locale]/(account)/layout.tsx @@ -1,10 +1,7 @@ import { getUser } from '@/utils/server-api/account/user' import { redirect } from '@/navigation' -import { createSessionServerClient } from '@/app/appwrite-session' export default async function Layout({ children }) { - const { account } = await createSessionServerClient() - try { await getUser() return children diff --git a/src/app/[locale]/(main)/forgot-password/page.client.tsx b/src/app/[locale]/(auth)/forgot-password/page.client.tsx similarity index 100% rename from src/app/[locale]/(main)/forgot-password/page.client.tsx rename to src/app/[locale]/(auth)/forgot-password/page.client.tsx diff --git a/src/app/[locale]/(main)/forgot-password/page.tsx b/src/app/[locale]/(auth)/forgot-password/page.tsx similarity index 100% rename from src/app/[locale]/(main)/forgot-password/page.tsx rename to src/app/[locale]/(auth)/forgot-password/page.tsx diff --git a/src/app/[locale]/(auth)/layout.tsx b/src/app/[locale]/(auth)/layout.tsx deleted file mode 100644 index c08b1af0..00000000 --- a/src/app/[locale]/(auth)/layout.tsx +++ /dev/null @@ -1,3 +0,0 @@ -export default async function LocaleLayout({ children }) { - return children -} diff --git a/src/app/[locale]/(auth)/login/mfa/page.tsx b/src/app/[locale]/(auth)/login/mfa/page.tsx index 833b7e5d..ed214161 100644 --- a/src/app/[locale]/(auth)/login/mfa/page.tsx +++ b/src/app/[locale]/(auth)/login/mfa/page.tsx @@ -1,6 +1,6 @@ import { Button } from '@/components/ui/button' import { Link } from '@/navigation' -import MfaPageClient from '@/app/[locale]/(auth)/login/mfa/page.client' +import MfaPageClient from './page.client' export const metadata = { title: 'Login', diff --git a/src/app/[locale]/(auth)/login/page.client.tsx b/src/app/[locale]/(auth)/login/page.client.tsx index 6ddac92a..0aa3b8d5 100644 --- a/src/app/[locale]/(auth)/login/page.client.tsx +++ b/src/app/[locale]/(auth)/login/page.client.tsx @@ -26,6 +26,7 @@ import { createUser } from '@/utils/actions/login-actions' import { Link } from '@/navigation' import { account, client } from '@/app/appwrite-client' import PageLayout from '@/components/pageLayout' +import { useUser } from '@/components/contexts/UserContext' export default function Login() { const [data, setData] = useState({ @@ -36,6 +37,7 @@ export default function Login() { const [acceptedTerms, setAcceptedTerms] = useState(false) const [isRegistering, setIsRegistering] = useState(false) const { toast } = useToast() + const { setUser } = useUser() const handleEmailLogin = async (e: any) => { e.preventDefault() @@ -70,6 +72,7 @@ export default function Login() { const dataResponse = await signIn() client.setSession(dataResponse.secret) + await account.createVerification('https://headpat.place/i/verify-email') window.location.href = '/account' } else { const dataResponse = await signIn() @@ -201,6 +204,9 @@ export default function Login() { > {isRegistering ? 'Register' : 'Login'} + diff --git a/src/components/contexts/UserContext.tsx b/src/components/contexts/UserContext.tsx index 448898f2..36e6cbcc 100644 --- a/src/components/contexts/UserContext.tsx +++ b/src/components/contexts/UserContext.tsx @@ -5,7 +5,7 @@ import { account } from '@/app/appwrite-client' import { ID } from 'node-appwrite' interface UserContextValue { - current: Account.AccountType | null + current: Account.AccountPrefs | null setUser: React.Dispatch> login: (email: string, password: string) => Promise loginOAuth: (userId: string, secret: string) => Promise diff --git a/src/components/header/header-resizable.tsx b/src/components/header/header-resizable.tsx index f3b773b0..5439ef4d 100644 --- a/src/components/header/header-resizable.tsx +++ b/src/components/header/header-resizable.tsx @@ -11,7 +11,7 @@ import { TooltipProvider } from '@/components/ui/tooltip' import { Nav } from '@/components/header/header-nav' import { ScrollArea } from '@/components/ui/scroll-area' import { Nav1, Nav2, Nav3, NavFooter } from '@/components/header/data' -import React, { useState } from 'react' +import React, { useEffect, useState } from 'react' import Image from 'next/image' import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar' import { ChevronUpIcon } from 'lucide-react' @@ -22,30 +22,58 @@ import { DropdownMenuSeparator, DropdownMenuTrigger, } from '@/components/ui/dropdown-menu' -import { Account, UserData } from '@/utils/types/models' +import { UserData } from '@/utils/types/models' import { Link, useRouter } from '@/navigation' +import { useUser } from '@/components/contexts/UserContext' +import { databases } from '@/app/appwrite-client' +import { toast } from 'sonner' + +const getAvatar = (id: string) => { + if (!id) return + + return `${process.env.NEXT_PUBLIC_API_URL}/v1/storage/buckets/avatars/files/${id}/preview?project=${process.env.NEXT_PUBLIC_APPWRITE_PROJECT_ID}&width=250&height=250&quality=50` +} export default function SidebarResizable({ defaultLayout = [265, 440, 655], defaultCollapsed = false, navCollapsedSize, - accountData, - userData, - userImage, translations, children, }: { defaultLayout: number[] defaultCollapsed: boolean navCollapsedSize: number - accountData: Account.AccountPrefs - userData: UserData.UserDataDocumentsType - userImage: string translations: any children: React.ReactNode }) { const [isCollapsed, setIsCollapsed] = useState(defaultCollapsed) + const [userData, setUserData] = + useState(null) + const [userImage, setUserImage] = useState(null) const router = useRouter() + const { current } = useUser() + + useEffect(() => { + const fetchData = async () => { + if (current) { + try { + await databases + .getDocument('hp_db', 'userdata', `${current.$id}`) + .then((data: UserData.UserDataDocumentsType) => { + setUserData(data) + const image = getAvatar(data.avatarId) + setUserImage(image) + }) + } catch (error) { + toast.error('Failed to fetch user data') + } + } + } + + fetchData().then() + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [current]) return ( @@ -118,7 +146,7 @@ export default function SidebarResizable({