"use client"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import UnitCard from "@/components/units/UnitCard"; import { Button } from "./ui/button"; import NoResults from "./NoResults"; import { useState } from "react"; import Dialog from "./ui/dialog"; import SubEstateCard from "./SubEstateCard"; import { PropertyCard } from "@/types/property-card"; type UnitsStatusTabsProps = { units?: PropertyCard[]; } const UnitsStatusTabs = ({ units = [] }: UnitsStatusTabsProps) => { const [showSubEstates, setShowSubEstates] = useState(false); // Filter units based on status from backend // Typically: 'available', 'booked', 'sold' const availableUnits = units.filter(unit => (unit as any).status === 'available' || (unit as any).status === 'متاح'); const bookedUnits = units.filter(unit => (unit as any).status === 'booked' || (unit as any).status === 'محجوز'); const soldUnits = units.filter(unit => (unit as any).status === 'sold' || (unit as any).status === 'مباع'); const hasUnits = units.length > 0; return (
الكل متاح محجوز مباع
{hasUnits ? ( <>
{units.map((card, index) => ( setShowSubEstates(true)} /> ))}
) : ( )} {availableUnits.length > 0 ? ( <>
{availableUnits.map((card, index) => ( setShowSubEstates(true)} /> ))}
) : ( )} {bookedUnits.length > 0 ? ( <>
{bookedUnits.map((card, index) => ( setShowSubEstates(true)} /> ))}
) : ( )} {soldUnits.length > 0 ? ( <>
{soldUnits.map((card, index) => ( setShowSubEstates(true)} /> ))}
) : ( )}
{ setShowSubEstates(false); }} />
); }; const NavigationButtons = () => { return (
) } const AllIcon = () => { return ( ); }; const AvailableIcon = () => { return ( ); }; const BookedIcon = () => { return ( ); }; const SoldIcon = () => { return ( ); }; export default UnitsStatusTabs;