Fix order detail view HTML

- Allow HTML in Akses description and product descriptions
- Fix member order detail page so clicking shows details (adjust navigation approach)
- Review undo status against provided task list and gaps

X-Lovable-Edit-ID: edt-5b53d6da-64ae-4165-a4e2-12eaaef938a6
This commit is contained in:
gpt-engineer-app[bot]
2025-12-19 15:45:41 +00:00
2 changed files with 28 additions and 23 deletions

View File

@@ -131,7 +131,10 @@ export default function MemberAccess() {
</div> </div>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<p className="text-muted-foreground mb-4 line-clamp-2">{item.product.description}</p> <div
className="text-muted-foreground mb-4 line-clamp-2 prose prose-sm max-w-none"
dangerouslySetInnerHTML={{ __html: item.product.description || '' }}
/>
{renderAccessActions(item)} {renderAccessActions(item)}
</CardContent> </CardContent>
</Card> </Card>

View File

@@ -1,5 +1,5 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useNavigate, Link } from "react-router-dom"; import { useNavigate } from "react-router-dom";
import { AppLayout } from "@/components/AppLayout"; import { AppLayout } from "@/components/AppLayout";
import { useAuth } from "@/hooks/useAuth"; import { useAuth } from "@/hooks/useAuth";
import { supabase } from "@/integrations/supabase/client"; import { supabase } from "@/integrations/supabase/client";
@@ -97,28 +97,30 @@ export default function MemberOrders() {
) : ( ) : (
<div className="space-y-4"> <div className="space-y-4">
{orders.map((order) => ( {orders.map((order) => (
<Link key={order.id} to={`/orders/${order.id}`}> <Card
<Card className="border-2 border-border hover:border-primary transition-colors cursor-pointer"> key={order.id}
<CardContent className="py-4"> className="border-2 border-border hover:border-primary transition-colors cursor-pointer"
<div className="flex items-center justify-between"> onClick={() => navigate(`/orders/${order.id}`)}
<div> >
<p className="font-mono text-sm text-muted-foreground">{order.id.slice(0, 8)}</p> <CardContent className="py-4">
<p className="text-sm text-muted-foreground">{formatDate(order.created_at)}</p> <div className="flex items-center justify-between">
{order.payment_method && ( <div>
<p className="text-xs text-muted-foreground uppercase">{order.payment_method}</p> <p className="font-mono text-sm text-muted-foreground">{order.id.slice(0, 8)}</p>
)} <p className="text-sm text-muted-foreground">{formatDate(order.created_at)}</p>
</div> {order.payment_method && (
<div className="flex items-center gap-4"> <p className="text-xs text-muted-foreground uppercase">{order.payment_method}</p>
<Badge className={getStatusColor(order.payment_status || order.status)}> )}
{getPaymentStatusLabel(order.payment_status || order.status)}
</Badge>
<span className="font-bold">{formatIDR(order.total_amount)}</span>
<ChevronRight className="w-5 h-5 text-muted-foreground" />
</div>
</div> </div>
</CardContent> <div className="flex items-center gap-4">
</Card> <Badge className={getStatusColor(order.payment_status || order.status)}>
</Link> {getPaymentStatusLabel(order.payment_status || order.status)}
</Badge>
<span className="font-bold">{formatIDR(order.total_amount)}</span>
<ChevronRight className="w-5 h-5 text-muted-foreground" />
</div>
</div>
</CardContent>
</Card>
))} ))}
</div> </div>
)} )}