48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import {Card} from "@/components/ui/card";
|
|
import {Skeleton} from "@/components/ui/skeleton";
|
|
import {Customer} from "@/services/customers/entities/customer";
|
|
import React from "react";
|
|
|
|
type Props = {
|
|
loading: boolean;
|
|
customer: Customer | null;
|
|
sections: React.ReactNode[];
|
|
};
|
|
|
|
export default function CustomerDetailContent({loading, customer, sections}: Readonly<Props>) {
|
|
if (loading) {
|
|
return (
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 auto-rows-fr">
|
|
<Card className="p-4 space-y-2">
|
|
<Skeleton className="h-5 w-40"/>
|
|
<Skeleton className="h-4 w-64"/>
|
|
<Skeleton className="h-4 w-44"/>
|
|
<Skeleton className="h-4 w-72"/>
|
|
</Card>
|
|
<Card className="p-4 space-y-2">
|
|
<Skeleton className="h-5 w-40"/>
|
|
<Skeleton className="h-14 w-full"/>
|
|
</Card>
|
|
<Card className="p-4 space-y-2 md:col-span-2">
|
|
<Skeleton className="h-5 w-40"/>
|
|
<Skeleton className="h-20 w-full"/>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (!customer) {
|
|
return (
|
|
<div className="text-center text-muted-foreground pt-20">
|
|
<p className="text-lg">Keine Kundendaten gefunden.</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 auto-rows-fr">
|
|
{sections}
|
|
</div>
|
|
);
|
|
}
|