profi sayfası
This commit is contained in:
@@ -17,7 +17,7 @@
|
||||
---
|
||||
|
||||
## Mevcut Durum (Tamamlananlar)
|
||||
- [x] Kullanıcı Yönetimi (Admin Ekle/Sil).
|
||||
- [x] Kullanıcı Yönetimi (Admin Ekle/Sil/Düzenle + Telefon).
|
||||
- [x] Temel Site Ayarları (Başlık, İletişim).
|
||||
- [x] Ürün Yönetimi (Temel CRUD).
|
||||
- [x] Kategori Yönetimi (Arayüz hazır, veritabanı bekleniyor).
|
||||
|
||||
@@ -1,14 +1,40 @@
|
||||
import { createClient } from "@/lib/supabase-server"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { UserForm } from "@/components/dashboard/user-form"
|
||||
import { notFound } from "next/navigation"
|
||||
import { getProfile } from "@/lib/data"
|
||||
|
||||
export default async function ProfilePage() {
|
||||
const supabase = createClient()
|
||||
const { data: { user } } = await supabase.auth.getUser()
|
||||
|
||||
if (!user) {
|
||||
// Should be protected by middleware but just in case
|
||||
return <div>Lütfen giriş yapın.</div>
|
||||
}
|
||||
|
||||
// Fetch profile data
|
||||
const profile = await getProfile(user.id)
|
||||
|
||||
if (!profile) {
|
||||
// Fallback for user without profile row?
|
||||
// Or create one on the fly?
|
||||
return <div>Profil verisi bulunamadı.</div>
|
||||
}
|
||||
|
||||
const parts = (profile.full_name || "").split(' ')
|
||||
const firstName = parts[0] || ""
|
||||
const lastName = parts.slice(1).join(' ') || ""
|
||||
|
||||
const initialData = {
|
||||
firstName,
|
||||
lastName,
|
||||
phone: profile.phone || "",
|
||||
email: user.email || "",
|
||||
role: profile.role || "user"
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-8 pt-6">
|
||||
<div className="flex items-center justify-between space-y-2">
|
||||
@@ -20,28 +46,18 @@ export default async function ProfilePage() {
|
||||
<CardHeader>
|
||||
<CardTitle>Genel Bilgiler</CardTitle>
|
||||
<CardDescription>
|
||||
Kişisel profil bilgileriniz.
|
||||
Kişisel profil bilgilerinizi buradan güncelleyebilirsiniz.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6">
|
||||
<div className="flex items-center space-x-4">
|
||||
<div className="flex items-center space-x-4 mb-6">
|
||||
<Avatar className="h-20 w-20">
|
||||
<AvatarImage src="/avatars/01.png" alt="@parakasa" />
|
||||
<AvatarFallback>PK</AvatarFallback>
|
||||
</Avatar>
|
||||
<Button variant="outline">Fotoğraf Değiştir</Button>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1">
|
||||
<Label htmlFor="email">E-posta</Label>
|
||||
<Input id="email" value={user?.email || ""} disabled />
|
||||
<p className="text-xs text-muted-foreground">E-posta adresi değiştirilemez.</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1">
|
||||
<Label htmlFor="role">Rol</Label>
|
||||
<Input id="role" value={user?.role === 'authenticated' ? 'Yönetici' : 'Kullanıcı'} disabled />
|
||||
</div>
|
||||
<UserForm initialData={initialData} mode="profile" />
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
15
app/(dashboard)/dashboard/profile/password/page.tsx
Normal file
15
app/(dashboard)/dashboard/profile/password/page.tsx
Normal file
@@ -0,0 +1,15 @@
|
||||
|
||||
import { PasswordForm } from "../../../../../components/dashboard/password-form"
|
||||
|
||||
export default function ChangePasswordPage() {
|
||||
return (
|
||||
<div className="flex-1 space-y-4 p-8 pt-6">
|
||||
<div className="flex items-center justify-between space-y-2">
|
||||
<h2 className="text-3xl font-bold tracking-tight">Şifre Değiştir</h2>
|
||||
</div>
|
||||
<div className="max-w-md">
|
||||
<PasswordForm />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -64,6 +64,7 @@ async function getUserDetails(userId: string) {
|
||||
firstName,
|
||||
lastName,
|
||||
email: user.email || "",
|
||||
role: profile.role as "admin" | "user"
|
||||
role: profile.role as "admin" | "user",
|
||||
phone: profile.phone || ""
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,7 +18,7 @@ const supabaseAdmin = createSupabaseClient(
|
||||
}
|
||||
)
|
||||
|
||||
export async function createUser(firstName: string, lastName: string, email: string, password: string, role: 'admin' | 'user') {
|
||||
export async function createUser(firstName: string, lastName: string, email: string, password: string, role: 'admin' | 'user', phone?: string) {
|
||||
const supabase = createClient()
|
||||
|
||||
// 1. Check if current user is admin
|
||||
@@ -59,7 +59,8 @@ export async function createUser(firstName: string, lastName: string, email: str
|
||||
.insert({
|
||||
id: newUser.user.id,
|
||||
full_name: `${firstName} ${lastName}`.trim(),
|
||||
role: role
|
||||
role: role,
|
||||
phone: phone
|
||||
})
|
||||
|
||||
if (profileError) {
|
||||
@@ -91,7 +92,7 @@ export async function deleteUser(userId: string) {
|
||||
return { success: true }
|
||||
}
|
||||
|
||||
export async function updateUser(userId: string, data: { firstName: string, lastName: string, email: string, password?: string, role: 'admin' | 'user' }) {
|
||||
export async function updateUser(userId: string, data: { firstName: string, lastName: string, email: string, password?: string, role: 'admin' | 'user', phone?: string }) {
|
||||
const supabase = createClient()
|
||||
|
||||
// Check admin
|
||||
@@ -107,7 +108,8 @@ export async function updateUser(userId: string, data: { firstName: string, last
|
||||
.from('profiles')
|
||||
.update({
|
||||
full_name: `${data.firstName} ${data.lastName}`.trim(),
|
||||
role: data.role
|
||||
role: data.role,
|
||||
phone: data.phone
|
||||
})
|
||||
.eq('id', userId)
|
||||
|
||||
@@ -131,3 +133,32 @@ export async function updateUser(userId: string, data: { firstName: string, last
|
||||
revalidatePath("/dashboard/users")
|
||||
return { success: true }
|
||||
}
|
||||
|
||||
export async function updateProfile(data: { firstName: string, lastName: string, phone?: string }) {
|
||||
const supabase = createClient()
|
||||
const { data: { user } } = await supabase.auth.getUser()
|
||||
|
||||
if (!user) return { error: "Oturum açmanız gerekiyor." }
|
||||
|
||||
const { error } = await supabase
|
||||
.from('profiles')
|
||||
.update({
|
||||
full_name: `${data.firstName} ${data.lastName}`.trim(),
|
||||
phone: data.phone
|
||||
})
|
||||
.eq('id', user.id)
|
||||
|
||||
if (error) return { error: "Profil güncellenemedi: " + error.message }
|
||||
|
||||
// Update Auth Metadata as well
|
||||
if (data.firstName || data.lastName) {
|
||||
await supabase.auth.updateUser({
|
||||
data: {
|
||||
full_name: `${data.firstName} ${data.lastName}`.trim()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
revalidatePath("/dashboard/profile")
|
||||
return { success: true }
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { getProfile } from "@/lib/data"
|
||||
import { createClient } from "@/lib/supabase-server"
|
||||
import { redirect } from "next/navigation"
|
||||
import { Sidebar } from "@/components/dashboard/sidebar"
|
||||
@@ -15,6 +16,8 @@ export default async function DashboardLayout({
|
||||
redirect("/login")
|
||||
}
|
||||
|
||||
const profile = await getProfile(user.id)
|
||||
|
||||
return (
|
||||
<div className="flex min-h-screen w-full flex-col bg-muted/40">
|
||||
<aside className="fixed inset-y-0 left-0 z-10 hidden w-64 flex-col border-r bg-background sm:flex">
|
||||
@@ -24,7 +27,7 @@ export default async function DashboardLayout({
|
||||
<Sidebar className="flex-1" />
|
||||
</aside>
|
||||
<div className="flex flex-col sm:gap-4 sm:py-4 sm:pl-64">
|
||||
<DashboardHeader />
|
||||
<DashboardHeader user={user} profile={profile} />
|
||||
<main className="grid flex-1 items-start gap-4 p-4 sm:px-6 sm:py-0 md:gap-8">
|
||||
{children}
|
||||
</main>
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@import 'react-phone-number-input/style.css';
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@@ -6,7 +6,12 @@ import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet"
|
||||
import { Sidebar } from "@/components/dashboard/sidebar"
|
||||
import { UserNav } from "@/components/dashboard/user-nav"
|
||||
|
||||
export function DashboardHeader() {
|
||||
interface DashboardHeaderProps {
|
||||
user: { email?: string | null } | null
|
||||
profile: { full_name?: string | null, role?: string | null } | null
|
||||
}
|
||||
|
||||
export function DashboardHeader({ user, profile }: DashboardHeaderProps) {
|
||||
return (
|
||||
<header className="sticky top-0 z-30 flex h-14 items-center gap-4 border-b bg-background px-4 sm:static sm:h-auto sm:border-0 sm:bg-transparent sm:px-6">
|
||||
<Sheet>
|
||||
@@ -28,7 +33,7 @@ export function DashboardHeader() {
|
||||
<div className="w-full flex-1">
|
||||
{/* Breadcrumb or Search could go here */}
|
||||
</div>
|
||||
<UserNav />
|
||||
<UserNav user={user} profile={profile} />
|
||||
</header>
|
||||
)
|
||||
}
|
||||
|
||||
113
components/dashboard/password-form.tsx
Normal file
113
components/dashboard/password-form.tsx
Normal file
@@ -0,0 +1,113 @@
|
||||
"use client"
|
||||
|
||||
import { useState } from "react"
|
||||
import { useRouter } from "next/navigation"
|
||||
import { useForm } from "react-hook-form"
|
||||
import { zodResolver } from "@hookform/resolvers/zod"
|
||||
import * as z from "zod"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormMessage,
|
||||
} from "@/components/ui/form"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { toast } from "sonner"
|
||||
import { Loader2 } from "lucide-react"
|
||||
import { supabase } from "@/lib/supabase"
|
||||
|
||||
const passwordSchema = z.object({
|
||||
password: z.string().min(6, "Şifre en az 6 karakter olmalıdır."),
|
||||
confirmPassword: z.string().min(6, "Şifre tekrarı en az 6 karakter olmalıdır."),
|
||||
}).refine((data) => data.password === data.confirmPassword, {
|
||||
message: "Şifreler eşleşmiyor.",
|
||||
path: ["confirmPassword"],
|
||||
})
|
||||
|
||||
type PasswordFormValues = z.infer<typeof passwordSchema>
|
||||
|
||||
export function PasswordForm() {
|
||||
const router = useRouter()
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
const form = useForm<PasswordFormValues>({
|
||||
resolver: zodResolver(passwordSchema),
|
||||
defaultValues: {
|
||||
password: "",
|
||||
confirmPassword: "",
|
||||
},
|
||||
})
|
||||
|
||||
const onSubmit = async (data: PasswordFormValues) => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const { error } = await supabase.auth.updateUser({
|
||||
password: data.password
|
||||
})
|
||||
|
||||
if (error) {
|
||||
toast.error("Şifre güncellenemedi: " + error.message)
|
||||
return
|
||||
}
|
||||
|
||||
toast.success("Şifreniz başarıyla güncellendi.")
|
||||
form.reset()
|
||||
router.refresh()
|
||||
} catch (error) {
|
||||
toast.error("Bir sorun oluştu.")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Yeni Şifre Belirle</CardTitle>
|
||||
<CardDescription>
|
||||
Hesabınız için yeni bir şifre belirleyin.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Form {...form}>
|
||||
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="password"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Yeni Şifre</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="password" placeholder="******" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="confirmPassword"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Şifre Tekrar</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="password" placeholder="******" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<Button type="submit" disabled={loading}>
|
||||
{loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Şifreyi Güncelle
|
||||
</Button>
|
||||
</form>
|
||||
</Form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
@@ -7,6 +7,7 @@ import { zodResolver } from "@hookform/resolvers/zod"
|
||||
import * as z from "zod"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { PhoneInput } from "@/components/ui/phone-input"
|
||||
import {
|
||||
Form,
|
||||
FormControl,
|
||||
@@ -25,34 +26,45 @@ import {
|
||||
import { Card, CardContent } from "@/components/ui/card"
|
||||
import { toast } from "sonner"
|
||||
import { Loader2 } from "lucide-react"
|
||||
import { createUser, updateUser } from "@/app/(dashboard)/dashboard/users/actions"
|
||||
import { createUser, updateUser, updateProfile } from "@/app/(dashboard)/dashboard/users/actions"
|
||||
|
||||
const userSchema = z.object({
|
||||
firstName: z.string().min(2, "Ad en az 2 karakter olmalıdır."),
|
||||
lastName: z.string().min(2, "Soyad en az 2 karakter olmalıdır."),
|
||||
email: z.string().email("Geçerli bir e-posta adresi giriniz."),
|
||||
password: z.string().optional(), // Password is optional on edit
|
||||
confirmPassword: z.string().optional(),
|
||||
role: z.enum(["admin", "user"]),
|
||||
phone: z.string().optional(),
|
||||
}).refine((data) => {
|
||||
// If we are creating a NEW user (no ID passed in props effectively, but schema doesn't know props),
|
||||
// we generally want password required. But here we'll handle it in the component logic or strictly separate schemas.
|
||||
// For simplicity, we make password optional in Zod but check it in onSubmit if it's a create action.
|
||||
// 1. Password match check
|
||||
if (data.password && data.password !== data.confirmPassword) {
|
||||
return false;
|
||||
}
|
||||
// 2. New user password requirement check (simplified here, but strict would check id)
|
||||
// We handle the "required" part in onSubmit manually for now as per previous logic,
|
||||
// but the matching check is now here.
|
||||
return true
|
||||
}, {
|
||||
message: "Şifreler eşleşmiyor.",
|
||||
path: ["confirmPassword"],
|
||||
})
|
||||
|
||||
type UserFormValues = z.infer<typeof userSchema>
|
||||
|
||||
interface UserFormProps {
|
||||
initialData?: {
|
||||
id: string
|
||||
id?: string
|
||||
firstName: string
|
||||
lastName: string
|
||||
email: string
|
||||
role: "admin" | "user"
|
||||
phone?: string
|
||||
}
|
||||
mode?: "admin" | "profile"
|
||||
}
|
||||
|
||||
export function UserForm({ initialData }: UserFormProps) {
|
||||
export function UserForm({ initialData, mode = "admin" }: UserFormProps) {
|
||||
const router = useRouter()
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
@@ -63,13 +75,17 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
lastName: initialData.lastName,
|
||||
email: initialData.email,
|
||||
password: "", // Empty password means no change
|
||||
confirmPassword: "",
|
||||
role: initialData.role,
|
||||
phone: initialData.phone,
|
||||
} : {
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
email: "",
|
||||
password: "",
|
||||
confirmPassword: "",
|
||||
role: "user",
|
||||
phone: "",
|
||||
},
|
||||
})
|
||||
|
||||
@@ -77,17 +93,32 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
setLoading(true)
|
||||
try {
|
||||
let result;
|
||||
if (initialData) {
|
||||
// Update
|
||||
result = await updateUser(initialData.id, data)
|
||||
|
||||
if (mode === "profile") {
|
||||
// Profile update mode (self-service)
|
||||
result = await updateProfile({
|
||||
firstName: data.firstName,
|
||||
lastName: data.lastName,
|
||||
phone: data.phone
|
||||
})
|
||||
} else if (initialData?.id) {
|
||||
// Admin update mode
|
||||
result = await updateUser(initialData.id, {
|
||||
firstName: data.firstName,
|
||||
lastName: data.lastName,
|
||||
email: data.email,
|
||||
password: data.password,
|
||||
role: data.role,
|
||||
phone: data.phone
|
||||
})
|
||||
} else {
|
||||
// Create
|
||||
// Admin create mode
|
||||
if (!data.password || data.password.length < 6) {
|
||||
toast.error("Yeni kullanıcı için şifre gereklidir (min 6 karakter).")
|
||||
setLoading(false)
|
||||
return
|
||||
}
|
||||
result = await createUser(data.firstName, data.lastName, data.email, data.password, data.role)
|
||||
result = await createUser(data.firstName, data.lastName, data.email, data.password, data.role, data.phone)
|
||||
}
|
||||
|
||||
if (result.error) {
|
||||
@@ -95,9 +126,16 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
return
|
||||
}
|
||||
|
||||
toast.success(initialData ? "Kullanıcı güncellendi." : "Kullanıcı oluşturuldu.")
|
||||
router.push("/dashboard/users")
|
||||
toast.success(
|
||||
mode === "profile"
|
||||
? "Profil bilgileriniz güncellendi."
|
||||
: initialData ? "Kullanıcı güncellendi." : "Kullanıcı oluşturuldu."
|
||||
)
|
||||
|
||||
router.refresh()
|
||||
if (mode === "admin") {
|
||||
router.push("/dashboard/users")
|
||||
}
|
||||
} catch (error) {
|
||||
toast.error("Bir sorun oluştu.")
|
||||
} finally {
|
||||
@@ -141,18 +179,40 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="email"
|
||||
name="phone"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>E-posta</FormLabel>
|
||||
<FormLabel>Telefon</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="ahmet@parakasa.com" {...field} />
|
||||
<PhoneInput placeholder="555 123 4567" defaultCountry="TR" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="email"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>E-posta</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
placeholder="ahmet@parakasa.com"
|
||||
{...field}
|
||||
disabled={mode === "profile"}
|
||||
className={mode === "profile" ? "bg-muted" : ""}
|
||||
/>
|
||||
</FormControl>
|
||||
{mode === "profile" && <p className="text-[0.8rem] text-muted-foreground">E-posta adresi değiştirilemez.</p>}
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
{mode === "admin" && (
|
||||
<>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="password"
|
||||
@@ -167,6 +227,20 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="confirmPassword"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Şifre Tekrar</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="password" placeholder="******" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="role"
|
||||
@@ -188,10 +262,19 @@ export function UserForm({ initialData }: UserFormProps) {
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
||||
{mode === "profile" && (
|
||||
<div className="space-y-1">
|
||||
<FormLabel>Rol</FormLabel>
|
||||
<Input value={initialData?.role === 'admin' ? 'Yönetici' : 'Kullanıcı'} disabled className="bg-muted" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Button type="submit" disabled={loading} className="w-full">
|
||||
{loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Kullanıcı Oluştur
|
||||
{mode === "profile" ? "Değişiklikleri Kaydet" : (initialData ? "Kaydet" : "Kullanıcı Oluştur")}
|
||||
</Button>
|
||||
</form>
|
||||
</Form>
|
||||
|
||||
@@ -14,13 +14,30 @@ import {
|
||||
DropdownMenuItem,
|
||||
DropdownMenuLabel,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuShortcut,
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu"
|
||||
import { supabase } from "@/lib/supabase"
|
||||
import { useRouter } from "next/navigation"
|
||||
import { useEffect, useState } from "react"
|
||||
import { User } from "@supabase/supabase-js"
|
||||
|
||||
export function UserNav() {
|
||||
interface UserProfile {
|
||||
full_name: string | null
|
||||
email: string | null
|
||||
role: string | null
|
||||
}
|
||||
|
||||
interface UserNavProps {
|
||||
user: {
|
||||
email?: string | null
|
||||
} | null
|
||||
profile: {
|
||||
full_name?: string | null
|
||||
role?: string | null
|
||||
} | null
|
||||
}
|
||||
|
||||
export function UserNav({ user, profile }: UserNavProps) {
|
||||
const router = useRouter()
|
||||
|
||||
const handleSignOut = async () => {
|
||||
@@ -29,22 +46,31 @@ export function UserNav() {
|
||||
router.refresh()
|
||||
}
|
||||
|
||||
const getInitials = (name: string) => {
|
||||
return name
|
||||
.split(' ')
|
||||
.map((n) => n[0])
|
||||
.join('')
|
||||
.toUpperCase()
|
||||
.substring(0, 2)
|
||||
}
|
||||
|
||||
return (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button variant="ghost" className="relative h-8 w-8 rounded-full">
|
||||
<Avatar className="h-8 w-8">
|
||||
<AvatarImage src="/avatars/01.png" alt="@parakasa" />
|
||||
<AvatarFallback>PK</AvatarFallback>
|
||||
<AvatarImage src="/avatars/01.png" alt={profile?.full_name || "@parakasa"} />
|
||||
<AvatarFallback>{profile?.full_name ? getInitials(profile.full_name) : 'PK'}</AvatarFallback>
|
||||
</Avatar>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent className="w-56" align="end" forceMount>
|
||||
<DropdownMenuLabel className="font-normal">
|
||||
<div className="flex flex-col space-y-1">
|
||||
<p className="text-sm font-medium leading-none">Admin</p>
|
||||
<p className="text-sm font-medium leading-none">{profile?.full_name || 'Kullanıcı'}</p>
|
||||
<p className="text-xs leading-none text-muted-foreground">
|
||||
admin@parakasa.com
|
||||
{user?.email}
|
||||
</p>
|
||||
</div>
|
||||
</DropdownMenuLabel>
|
||||
@@ -52,23 +78,18 @@ export function UserNav() {
|
||||
<DropdownMenuGroup>
|
||||
<Link href="/dashboard/profile">
|
||||
<DropdownMenuItem className="cursor-pointer">
|
||||
Profil
|
||||
Profil Bilgileri
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
<Link href="/dashboard/users">
|
||||
<Link href="/dashboard/profile/password">
|
||||
<DropdownMenuItem className="cursor-pointer">
|
||||
Kullanıcılar
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
<Link href="/dashboard/settings">
|
||||
<DropdownMenuItem className="cursor-pointer">
|
||||
Ayarlar
|
||||
Şifre Değiştir
|
||||
</DropdownMenuItem>
|
||||
</Link>
|
||||
</DropdownMenuGroup>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem onClick={handleSignOut}>
|
||||
Çıkış Yap
|
||||
<DropdownMenuItem onClick={handleSignOut} className="cursor-pointer text-red-600 focus:text-red-600">
|
||||
Çıkış
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
|
||||
23
components/ui/phone-input.tsx
Normal file
23
components/ui/phone-input.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import * as React from "react"
|
||||
import PhoneInput from "react-phone-number-input"
|
||||
import { cn } from "@/lib/utils"
|
||||
|
||||
export interface PhoneInputProps extends React.ComponentProps<typeof PhoneInput> {
|
||||
className?: string
|
||||
}
|
||||
|
||||
const PhoneInputComponent = React.forwardRef<any, PhoneInputProps>(({ className, ...props }, ref) => {
|
||||
return (
|
||||
<PhoneInput
|
||||
ref={ref}
|
||||
className={cn("flex", className)} // Wrapper class
|
||||
numberInputProps={{
|
||||
className: "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
}}
|
||||
{...(props as any)}
|
||||
/>
|
||||
)
|
||||
})
|
||||
PhoneInputComponent.displayName = "PhoneInput"
|
||||
|
||||
export { PhoneInputComponent as PhoneInput }
|
||||
13
lib/data.ts
Normal file
13
lib/data.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { cache } from 'react'
|
||||
import { createClient } from '@/lib/supabase-server'
|
||||
|
||||
export const getProfile = cache(async (userId: string) => {
|
||||
const supabase = createClient()
|
||||
const { data } = await supabase
|
||||
.from('profiles')
|
||||
.select('*')
|
||||
.eq('id', userId)
|
||||
.single()
|
||||
|
||||
return data
|
||||
})
|
||||
60
package-lock.json
generated
60
package-lock.json
generated
@@ -30,6 +30,7 @@
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"react-hook-form": "^7.70.0",
|
||||
"react-phone-number-input": "^3.4.14",
|
||||
"sonner": "^2.0.7",
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"zod": "^4.3.5"
|
||||
@@ -2922,6 +2923,12 @@
|
||||
"url": "https://polar.sh/cva"
|
||||
}
|
||||
},
|
||||
"node_modules/classnames": {
|
||||
"version": "2.5.1",
|
||||
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz",
|
||||
"integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/client-only": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz",
|
||||
@@ -2987,6 +2994,12 @@
|
||||
"url": "https://opencollective.com/express"
|
||||
}
|
||||
},
|
||||
"node_modules/country-flag-icons": {
|
||||
"version": "1.6.4",
|
||||
"resolved": "https://registry.npmjs.org/country-flag-icons/-/country-flag-icons-1.6.4.tgz",
|
||||
"integrity": "sha512-Z3Zi419FI889tlElMsVhCIS5eRkiLDWixr576J5DPiTe5RGxpbRi+enMpHdYVp5iK5WFjr8P/RgyIFAGhFsiFg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/cross-spawn": {
|
||||
"version": "7.0.6",
|
||||
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
|
||||
@@ -4504,6 +4517,27 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/input-format": {
|
||||
"version": "0.3.14",
|
||||
"resolved": "https://registry.npmjs.org/input-format/-/input-format-0.3.14.tgz",
|
||||
"integrity": "sha512-gHMrgrbCgmT4uK5Um5eVDUohuV9lcs95ZUUN9Px2Y0VIfjTzT2wF8Q3Z4fwLFm7c5Z2OXCm53FHoovj6SlOKdg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"prop-types": "^15.8.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18.1.0",
|
||||
"react-dom": ">=18.1.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react": {
|
||||
"optional": true
|
||||
},
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/internal-slot": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
|
||||
@@ -5128,6 +5162,12 @@
|
||||
"node": ">= 0.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/libphonenumber-js": {
|
||||
"version": "1.12.33",
|
||||
"resolved": "https://registry.npmjs.org/libphonenumber-js/-/libphonenumber-js-1.12.33.tgz",
|
||||
"integrity": "sha512-r9kw4OA6oDO4dPXkOrXTkArQAafIKAU71hChInV4FxZ69dxCfbwQGDPzqR5/vea94wU705/3AZroEbSoeVWrQw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lilconfig": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz",
|
||||
@@ -5436,7 +5476,6 @@
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
|
||||
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
@@ -5936,7 +5975,6 @@
|
||||
"version": "15.8.1",
|
||||
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
|
||||
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"loose-envify": "^1.4.0",
|
||||
@@ -6020,9 +6058,25 @@
|
||||
"version": "16.13.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/react-phone-number-input": {
|
||||
"version": "3.4.14",
|
||||
"resolved": "https://registry.npmjs.org/react-phone-number-input/-/react-phone-number-input-3.4.14.tgz",
|
||||
"integrity": "sha512-T9MziNuvthzv6+JAhKD71ab/jVXW5U20nQZRBJd6+q+ujmkC+/ISOf2GYo8pIi4VGjdIYRIHDftMAYn3WKZT3w==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"classnames": "^2.5.1",
|
||||
"country-flag-icons": "^1.5.17",
|
||||
"input-format": "^0.3.14",
|
||||
"libphonenumber-js": "^1.12.27",
|
||||
"prop-types": "^15.8.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8",
|
||||
"react-dom": ">=16.8"
|
||||
}
|
||||
},
|
||||
"node_modules/react-remove-scroll": {
|
||||
"version": "2.7.2",
|
||||
"resolved": "https://registry.npmjs.org/react-remove-scroll/-/react-remove-scroll-2.7.2.tgz",
|
||||
|
||||
@@ -31,6 +31,7 @@
|
||||
"react": "^18",
|
||||
"react-dom": "^18",
|
||||
"react-hook-form": "^7.70.0",
|
||||
"react-phone-number-input": "^3.4.14",
|
||||
"sonner": "^2.0.7",
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"zod": "^4.3.5"
|
||||
|
||||
BIN
public/avatars/01.png
Normal file
BIN
public/avatars/01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 379 KiB |
3
supabase_migration_add_phone.sql
Normal file
3
supabase_migration_add_phone.sql
Normal file
@@ -0,0 +1,3 @@
|
||||
|
||||
-- Add phone column to profiles table
|
||||
ALTER TABLE profiles ADD COLUMN IF NOT EXISTS phone TEXT;
|
||||
Reference in New Issue
Block a user