Type Alias ActionWithHref

EmptyState Component

Reusable UI component displayed when a list or page has no data. Supports an optional icon/illustration and an optional primary action (navigation via href or callback via onClick).

Example

With navigation action
<EmptyState
  title="No videos yet"
  description="Upload your first video to get started."
  action={{ label: "Upload video", href: "/upload" }}
/>

Example

With callback action
<EmptyState
  title="Something went wrong"
  description="We couldn't load the list."
  action={{ label: "Try again", onClick: () => refetch() }}
/>

Example

With icon
<EmptyState
  icon={<InboxIcon className="h-12 w-12 text-muted-foreground" />}
  title="No messages"
  description="Your inbox is empty."
/>

type ActionWithHref = {
label: string;
href: string;
}

Index

Properties

label href

Properties

label

label: string

href

href: string

Type Alias ActionWithHref

Example

Example

Example

Index

Properties

Properties

label

href

Settings

On This Page