cart-items-empty.tsx

'use client'

import Link from 'next/link'
import { Plus, XCircle } from 'lucide-react'

import { Button } from '../components/ui/button'

export function CartItemsEmpty() {
  return (
    <div className="flex h-[450px] shrink-0 items-center justify-center rounded-md border-2 border-dashed border-gray-300 dark:border-gray-800">
      <div className="mx-auto flex max-w-[420px] flex-col items-center justify-center text-center">
        <XCircle className="h-10 w-10 text-muted-foreground" />
        <h3 className="mt-4 text-lg font-semibold">
          Nenhum produto adicionado
        </h3>
        <p className="mb-4 mt-2 text-sm text-muted-foreground">
          Adicione produtos na sacola.
        </p>
        <Link href="/products">
          <Button size="sm" className="relative">
            <Plus className="mr-2 h-4 w-4" />
            Adicionar Produto
          </Button>
        </Link>
      </div>
    </div>
  )
}