Skip to main content
Newgentleduck/ui — Charts, Sidebar blocks, and moreSee what's new

Building Blocks for Modern Apps

Pre-built, composable UI blocks you can drop into any React project. Ship complete features in minutes.

Files
components/dashboard-1/dashboard-1.tsx
'use client'
import { SidebarInset, SidebarProvider } from '@gentleduck/registry-ui/sidebar'
import { AppSidebar } from './components/app-sidebar'
import { ChartAreaInteractive } from './components/chart-area-interactive'
import { DataTable } from './components/data-table'
import { SectionCards } from './components/section-cards'
import { SiteHeader } from './components/site-header'
import data from './data.json'

export function Page() {
  return (
    <SidebarProvider>
      <AppSidebar />
      <SidebarInset>
        <SiteHeader />
        <div className="flex flex-1 flex-col">
          <div className="@container/main flex flex-1 flex-col gap-2">
            <div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
              <SectionCards />
              <div className="px-4 lg:px-6">
                <ChartAreaInteractive />
              </div>
              <DataTable data={data} />
            </div>
          </div>
        </div>
      </SidebarInset>
    </SidebarProvider>
  )
}
dashboard-1