EmptyRtl() — ui Function Reference

Architecture documentation for the EmptyRtl() function in empty-rtl.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing

Entity Profile

DocumentationAtlas→ ContentSourcing→ EmptyRtl() — ui Function Reference

Dependency Diagram

graph TD
  eea8a31a_39d6_7901_82dd_44ada97fe73f["EmptyRtl()"]
  4fa35b37_4e99_3053_f845_9f6ddc369d98["empty-rtl.tsx"]
  eea8a31a_39d6_7901_82dd_44ada97fe73f -->|defined in| 4fa35b37_4e99_3053_f845_9f6ddc369d98
  style eea8a31a_39d6_7901_82dd_44ada97fe73f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/base/empty-rtl.tsx lines 56–84

export function EmptyRtl() {
  const { dir, t } = useTranslation(translations, "ar")

  return (
    <Empty dir={dir}>
      <EmptyHeader>
        <EmptyMedia variant="icon">
          <IconFolderCode />
        </EmptyMedia>
        <EmptyTitle>{t.title}</EmptyTitle>
        <EmptyDescription>{t.description}</EmptyDescription>
      </EmptyHeader>
      <EmptyContent className="flex-row justify-center gap-2">
        <Button>{t.createProject}</Button>
        <Button variant="outline">{t.importProject}</Button>
      </EmptyContent>
      <Button
        variant="link"
        render={<a href="#" />}
        className="text-muted-foreground"
        size="sm"
        nativeButton={false}
      >
        {t.learnMore}{" "}
        <ArrowUpRightIcon className="rtl:rotate-270" data-icon="inline-end" />
      </Button>
    </Empty>
  )
}