Fix consulting order processing and display
- Fix consulting history to show continuous time range (09:00 - 11:00) instead of listing individual slots - Add foreign key relationships for consulting_slots (order_id and user_id) - Fix handle-order-paid to query profiles(email, name) instead of full_name - Add completed consulting sessions with recordings to Member Access page - Add user_id foreign key constraint to consulting_slots table - Add orders foreign key constraint for consulting_slots relationship 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
dwindown
@@ -7,8 +7,10 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Skeleton } from '@/components/ui/skeleton';
|
||||
import { Video, Calendar, BookOpen, ArrowRight, Search, X } from 'lucide-react';
|
||||
import { Video, Calendar, BookOpen, ArrowRight, Search, X, Clock } from 'lucide-react';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { format } from 'date-fns';
|
||||
import { id } from 'date-fns/locale';
|
||||
|
||||
interface UserAccess {
|
||||
id: string;
|
||||
@@ -25,10 +27,21 @@ interface UserAccess {
|
||||
};
|
||||
}
|
||||
|
||||
interface ConsultingSession {
|
||||
id: string;
|
||||
date: string;
|
||||
start_time: string;
|
||||
end_time: string;
|
||||
status: string;
|
||||
recording_url: string | null;
|
||||
topic_category: string | null;
|
||||
}
|
||||
|
||||
export default function MemberAccess() {
|
||||
const { user, loading: authLoading } = useAuth();
|
||||
const navigate = useNavigate();
|
||||
const [access, setAccess] = useState<UserAccess[]>([]);
|
||||
const [consultingSessions, setConsultingSessions] = useState<ConsultingSession[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [searchQuery, setSearchQuery] = useState('');
|
||||
const [selectedType, setSelectedType] = useState<string>('all');
|
||||
@@ -39,7 +52,7 @@ export default function MemberAccess() {
|
||||
}, [user, authLoading]);
|
||||
|
||||
const fetchAccess = async () => {
|
||||
const [accessRes, paidOrdersRes] = await Promise.all([
|
||||
const [accessRes, paidOrdersRes, consultingRes] = await Promise.all([
|
||||
// Get direct user_access
|
||||
supabase
|
||||
.from('user_access')
|
||||
@@ -57,6 +70,13 @@ export default function MemberAccess() {
|
||||
)
|
||||
.eq("user_id", user!.id)
|
||||
.eq("payment_status", "paid"),
|
||||
// Get completed consulting sessions with recordings
|
||||
supabase
|
||||
.from('consulting_slots')
|
||||
.select('id, date, start_time, end_time, status, recording_url, topic_category')
|
||||
.eq('user_id', user!.id)
|
||||
.eq('status', 'done')
|
||||
.order('date', { ascending: false }),
|
||||
]);
|
||||
|
||||
// Combine access from user_access and paid orders
|
||||
@@ -81,6 +101,7 @@ export default function MemberAccess() {
|
||||
}
|
||||
|
||||
setAccess([...directAccess, ...paidProductAccess]);
|
||||
setConsultingSessions(consultingRes.data || []);
|
||||
setLoading(false);
|
||||
};
|
||||
|
||||
@@ -249,7 +270,60 @@ export default function MemberAccess() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{access.length === 0 ? (
|
||||
{/* Consulting Sessions with Recordings */}
|
||||
{consultingSessions.length > 0 && (
|
||||
<div className="mb-8">
|
||||
<h2 className="text-2xl font-bold mb-4 flex items-center gap-2">
|
||||
<Video className="w-6 h-6" />
|
||||
Sesi Konsultasi Selesai
|
||||
</h2>
|
||||
<div className="grid gap-4">
|
||||
{consultingSessions.map((session) => (
|
||||
<Card key={session.id} className="border-2 border-border">
|
||||
<CardHeader>
|
||||
<div className="flex items-start justify-between">
|
||||
<div>
|
||||
<CardTitle className="text-xl">
|
||||
1-on-1: {session.topic_category || 'Konsultasi'}
|
||||
</CardTitle>
|
||||
<CardDescription>Konsultasi</CardDescription>
|
||||
</div>
|
||||
<Badge className="bg-brand-accent text-white rounded-full">Selesai</Badge>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="flex items-center gap-2 text-sm text-muted-foreground mb-4">
|
||||
<Calendar className="w-4 h-4" />
|
||||
<span>{format(new Date(session.date), 'd MMMM yyyy', { locale: id })}</span>
|
||||
<Clock className="w-4 h-4 ml-2" />
|
||||
<span>{session.start_time.substring(0, 5)} - {session.end_time.substring(0, 5)}</span>
|
||||
</div>
|
||||
{session.recording_url ? (
|
||||
<Button asChild className="shadow-sm">
|
||||
<a href={session.recording_url} target="_blank" rel="noopener noreferrer">
|
||||
<Video className="w-4 h-4 mr-2" />
|
||||
Tonton Rekaman
|
||||
<ArrowRight className="w-4 h-4 ml-2" />
|
||||
</a>
|
||||
</Button>
|
||||
) : (
|
||||
<Badge className="bg-muted text-primary">Rekaman segera tersedia</Badge>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Products Section */}
|
||||
{access.length > 0 && (
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold mb-4">Produk & Kursus</h2>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{access.length === 0 && consultingSessions.length === 0 ? (
|
||||
<Card className="border-2 border-border">
|
||||
<CardContent className="py-12 text-center">
|
||||
<p className="text-muted-foreground mb-4">Anda belum memiliki akses ke produk apapun</p>
|
||||
@@ -258,7 +332,7 @@ export default function MemberAccess() {
|
||||
</Button>
|
||||
</CardContent>
|
||||
</Card>
|
||||
) : (
|
||||
) : access.length === 0 ? null : (
|
||||
<div className="grid gap-4">
|
||||
{filteredAccess.length === 0 && access.length > 0 && (
|
||||
<div className="text-center py-16">
|
||||
|
||||
Reference in New Issue
Block a user