Empty State

 1"use client";
 2
 3import { EmptyState } from "@/components/wensity/empty-state";
 4import { IconPlus } from "@tabler/icons-react";
 5
 6export function ActionEmptyState() {
 7  return (
 8    <EmptyState
 9      icon={<IconPlus />}
10      title="No API tokens"
11      description="Create a token to authenticate with the Wensity CLI."
12      action={
13        <button type="button">
14          <IconPlus />
15          New token
16        </button>
17      }
18    />
19  );
20}

 1"use client";
 2
 3import {
 4  EmptyState,
 5  EmptyStateIllustration,
 6} from "@/components/wensity/empty-state";
 7import { IconFileOff } from "@tabler/icons-react";
 8
 9export function IllustrationEmptyState() {
10  return (
11    <EmptyState
12      icon={
13        <EmptyStateIllustration>
14          <IconFileOff />
15        </EmptyStateIllustration>
16      }
17      title="No files uploaded"
18      description="Drag and drop assets or browse from your device."
19    />
20  );
21}

 1"use client";
 2
 3import { EmptyState } from "@/components/wensity/empty-state";
 4
 5export function AvatarEmptyState() {
 6  return (
 7    <EmptyState
 8      icon={
 9        <div className="overflow-hidden rounded-full border-2">
10          <img
11            src="https://assets.wensity.com/avatars/1.webp"
12            alt=""
13            className="grayscale"
14          />
15        </div>
16      }
17      title="No activity yet"
18      description="Parth has not pushed any commits this week."
19    />
20  );
21}

 1"use client";
 2
 3import { EmptyState } from "@/components/wensity/empty-state";
 4import { IconSearch, IconSearchOff } from "@tabler/icons-react";
 5
 6export function SearchEmptyState() {
 7  return (
 8    <EmptyState
 9      icon={<IconSearchOff />}
10      title='No results for "wensity-cli"'
11      description="Try adjusting your search or filter."
12      action={
13        <button type="button">
14          <IconSearch />
15          Clear search
16        </button>
17      }
18    />
19  );
20}

 1"use client";
 2
 3import { EmptyState } from "@/components/wensity/empty-state";
 4import { IconRefresh, IconServerOff } from "@tabler/icons-react";
 5
 6export function ErrorEmptyState() {
 7  return (
 8    <EmptyState
 9      icon={
10        <div className="rounded-full bg-red-500/10 text-red-500 dark:bg-red-500/15 dark:text-red-400">
11          <IconServerOff />
12        </div>
13      }
14      title="Failed to load workspace"
15      description="The server returned an unexpected error. Try again."
16      action={
17        <button type="button">
18          <IconRefresh />
19          Retry
20        </button>
21      }
22    />
23  );
24}