@bahulam/code 0.1.6 → 0.1.7

package/pulse/components/sessions/session-table.tsx

@@ -1,299 +0,0 @@
-'use client'
-
-import { useState, useMemo, useEffect, useRef } from 'react'
-import { useRouter } from 'next/navigation'
-import Link from 'next/link'
-import { SessionBadges } from './session-badges'
-import { formatCost, formatTokens, formatDuration, formatDate, projectDisplayName } from '@/lib/decode'
-import type { SessionWithFacet } from '@/types/claude'
-
-const PAGE_SIZE = 25
-
-type SortKey = 'start_time' | 'duration_minutes' | 'total_messages' | 'estimated_cost' | 'tool_calls'
-type SortDir = 'asc' | 'desc'
-
-interface Props {
-  sessions: SessionWithFacet[]
-}
-
-function SortHeader({
-  label, k, sortKey, sortDir, onSort,
-}: {
-  label: string
-  k: SortKey
-  sortKey: SortKey
-  sortDir: SortDir
-  onSort: (k: SortKey) => void
-}) {
-  const active = sortKey === k
-  return (
-    <button
-      onClick={() => onSort(k)}
-      className={`text-left text-[12px] font-bold uppercase tracking-wider whitespace-nowrap hover:text-foreground transition-colors ${active ? 'text-primary' : 'text-muted-foreground'}`}
-    >
-      {label} {active ? (sortDir === 'desc' ? '↓' : '↑') : ''}
-    </button>
-  )
-}
-
-export function SessionTable({ sessions }: Props) {
-  const [sortKey, setSortKey] = useState<SortKey>('start_time')
-  const [sortDir, setSortDir] = useState<SortDir>('desc')
-  const [page, setPage] = useState(1)
-  const [filterCompacted, setFilterCompacted] = useState(false)
-  const [filterAgent, setFilterAgent] = useState(false)
-  const [filterMcp, setFilterMcp] = useState(false)
-  const [search, setSearch] = useState('')
-  const [focusedIdx, setFocusedIdx] = useState<number | null>(null)
-  const rowRefs = useRef<(HTMLTableRowElement | null)[]>([])
-  const router = useRouter()
-
-  const filtered = useMemo(() => {
-    let s = sessions
-    if (filterCompacted) s = s.filter(x => x.has_compaction)
-    if (filterAgent)     s = s.filter(x => x.uses_task_agent)
-    if (filterMcp)       s = s.filter(x => x.uses_mcp)
-    if (search) {
-      const q = search.toLowerCase()
-      s = s.filter(x =>
-        x.project_path?.toLowerCase().includes(q) ||
-        x.first_prompt?.toLowerCase().includes(q) ||
-        x.slug?.toLowerCase().includes(q)
-      )
-    }
-    return s
-  }, [sessions, filterCompacted, filterAgent, filterMcp, search])
-
-  const sorted = useMemo(() => {
-    return [...filtered].sort((a, b) => {
-      let av: number, bv: number
-      if (sortKey === 'start_time') {
-        av = new Date(a.start_time).getTime()
-        bv = new Date(b.start_time).getTime()
-      } else if (sortKey === 'total_messages') {
-        av = (a.user_message_count ?? 0) + (a.assistant_message_count ?? 0)
-        bv = (b.user_message_count ?? 0) + (b.assistant_message_count ?? 0)
-      } else if (sortKey === 'tool_calls') {
-        av = Object.values(a.tool_counts ?? {}).reduce((s, c) => s + c, 0)
-        bv = Object.values(b.tool_counts ?? {}).reduce((s, c) => s + c, 0)
-      } else {
-        av = (a[sortKey] as number) ?? 0
-        bv = (b[sortKey] as number) ?? 0
-      }
-      return sortDir === 'desc' ? bv - av : av - bv
-    })
-  }, [filtered, sortKey, sortDir])
-
-  const totalPages = Math.ceil(sorted.length / PAGE_SIZE)
-  const paginated = sorted.slice((page - 1) * PAGE_SIZE, page * PAGE_SIZE)
-
-  // j/k keyboard navigation for rows
-  useEffect(() => {
-    function handler(e: KeyboardEvent) {
-      const el = document.activeElement
-      const tag = el?.tagName.toLowerCase()
-      if (tag === 'input' || tag === 'textarea' || (el as HTMLElement)?.isContentEditable) return
-
-      if (e.key === 'j') {
-        e.preventDefault()
-        setFocusedIdx(i => {
-          const next = i === null ? 0 : Math.min(i + 1, paginated.length - 1)
-          rowRefs.current[next]?.scrollIntoView({ block: 'nearest' })
-          return next
-        })
-      } else if (e.key === 'k') {
-        e.preventDefault()
-        setFocusedIdx(i => {
-          const next = i === null ? 0 : Math.max(i - 1, 0)
-          rowRefs.current[next]?.scrollIntoView({ block: 'nearest' })
-          return next
-        })
-      } else if (e.key === 'Enter' && focusedIdx !== null) {
-        const s = paginated[focusedIdx]
-        if (s) router.push(`/sessions/${s.session_id}`)
-      } else if (e.key === 'Escape' && focusedIdx !== null) {
-        setFocusedIdx(null)
-      }
-    }
-    window.addEventListener('keydown', handler)
-    return () => window.removeEventListener('keydown', handler)
-  }, [focusedIdx, paginated, router])
-
-  function toggleSort(key: SortKey) {
-    if (sortKey === key) setSortDir(d => d === 'desc' ? 'asc' : 'desc')
-    else { setSortKey(key); setSortDir('desc') }
-    setPage(1)
-    setFocusedIdx(null)
-  }
-
-  return (
-    <div className="space-y-3">
-      {/* Filters */}
-      <div className="flex flex-wrap gap-2 items-center">
-        <input
-          type="text"
-          placeholder="Search project or prompt..."
-          value={search}
-          onChange={e => { setSearch(e.target.value); setPage(1); setFocusedIdx(null) }}
-          className="bg-muted border border-border rounded px-2 py-1 text-[13px] text-foreground placeholder:text-muted-foreground/50 outline-none focus:border-primary/50 w-52"
-        />
-        <label className="flex items-center gap-1.5 text-[13px] text-muted-foreground cursor-pointer hover:text-foreground transition-colors">
-          <input
-            type="checkbox"
-            checked={filterCompacted}
-            onChange={e => { setFilterCompacted(e.target.checked); setPage(1); setFocusedIdx(null) }}
-            className="accent-amber-500"
-          />
-          ⚡ compacted
-        </label>
-        <label className="flex items-center gap-1.5 text-[13px] text-muted-foreground cursor-pointer hover:text-foreground transition-colors">
-          <input
-            type="checkbox"
-            checked={filterAgent}
-            onChange={e => { setFilterAgent(e.target.checked); setPage(1); setFocusedIdx(null) }}
-            className="accent-purple-500"
-          />
-          🤖 agent
-        </label>
-        <label className="flex items-center gap-1.5 text-[13px] text-muted-foreground cursor-pointer hover:text-foreground transition-colors">
-          <input
-            type="checkbox"
-            checked={filterMcp}
-            onChange={e => { setFilterMcp(e.target.checked); setPage(1); setFocusedIdx(null) }}
-            className="accent-blue-500"
-          />
-          🔌 mcp
-        </label>
-        <span className="ml-auto text-[13px] text-muted-foreground">
-          {filtered.length} sessions
-        </span>
-      </div>
-
-      {/* Table */}
-      <div className="border border-border rounded overflow-hidden">
-        <div className="overflow-x-auto">
-          <table className="w-full text-[13px]">
-            <thead>
-              <tr className="border-b border-border bg-muted">
-                <th className="px-3 py-2 text-left"><SortHeader label="Date" k="start_time" sortKey={sortKey} sortDir={sortDir} onSort={toggleSort} /></th>
-                <th className="px-3 py-2 text-left"><span className="text-[12px] font-bold uppercase tracking-wider text-muted-foreground">Project</span></th>
-                <th className="px-3 py-2 text-right"><SortHeader label="Dur" k="duration_minutes" sortKey={sortKey} sortDir={sortDir} onSort={toggleSort} /></th>
-                <th className="px-3 py-2 text-right"><SortHeader label="Msgs" k="total_messages" sortKey={sortKey} sortDir={sortDir} onSort={toggleSort} /></th>
-                <th className="px-3 py-2 text-right"><SortHeader label="Tools" k="tool_calls" sortKey={sortKey} sortDir={sortDir} onSort={toggleSort} /></th>
-                <th className="px-3 py-2 text-right"><SortHeader label="Cost" k="estimated_cost" sortKey={sortKey} sortDir={sortDir} onSort={toggleSort} /></th>
-                <th className="px-3 py-2 text-left"><span className="text-[12px] font-bold uppercase tracking-wider text-muted-foreground">Flags</span></th>
-              </tr>
-            </thead>
-            <tbody>
-              {paginated.map((s, i) => {
-                const totalMsgs = (s.user_message_count ?? 0) + (s.assistant_message_count ?? 0)
-                const totalTools = Object.values(s.tool_counts ?? {}).reduce((sum, c) => sum + c, 0)
-                const totalTokens = (s.input_tokens ?? 0) + (s.output_tokens ?? 0)
-                const projectName = projectDisplayName(s.project_path ?? '')
-
-                return (
-                  <tr
-                    key={s.session_id}
-                    ref={el => { rowRefs.current[i] = el }}
-                    className={[
-                      'border-b border-border/50 hover:bg-muted transition-colors',
-                      i % 2 === 0 ? '' : 'bg-muted/30',
-                      i === focusedIdx ? 'ring-2 ring-primary ring-inset bg-muted' : '',
-                    ].join(' ')}
-                  >
-                    <td className="px-3 py-2 font-mono text-muted-foreground whitespace-nowrap">
-                      {formatDate(s.start_time)}
-                    </td>
-                    <td className="px-3 py-2 max-w-[200px]">
-                      <Link
-                        href={`/sessions/${s.session_id}`}
-                        className="text-foreground hover:text-primary transition-colors font-medium truncate block"
-                        title={s.project_path ?? ''}
-                      >
-                        {projectName}
-                      </Link>
-                      {s.first_prompt && (
-                        <p className="text-muted-foreground/60 truncate text-[12px]">
-                          {s.first_prompt.slice(0, 60)}
-                        </p>
-                      )}
-                    </td>
-                    <td className="px-3 py-2 text-right text-muted-foreground whitespace-nowrap">
-                      {formatDuration(s.duration_minutes ?? 0)}
-                    </td>
-                    <td className="px-3 py-2 text-right text-muted-foreground">
-                      {totalMsgs.toLocaleString()}
-                    </td>
-                    <td className="px-3 py-2 text-right text-muted-foreground">
-                      {totalTools.toLocaleString()}
-                    </td>
-                    <td className="px-3 py-2 text-right font-mono text-primary">
-                      {formatCost(s.estimated_cost)}
-                    </td>
-                    <td className="px-3 py-2">
-                      <SessionBadges
-                        has_compaction={s.has_compaction}
-                        uses_task_agent={s.uses_task_agent}
-                        uses_mcp={s.uses_mcp}
-                        uses_web_search={s.uses_web_search}
-                        uses_web_fetch={s.uses_web_fetch}
-                        has_thinking={s.has_thinking}
-                      />
-                    </td>
-                  </tr>
-                )
-              })}
-              {paginated.length === 0 && (
-                <tr>
-                  <td colSpan={7} className="px-3 py-8 text-center text-muted-foreground/50 text-[13px]">
-                    No sessions match filters
-                  </td>
-                </tr>
-              )}
-            </tbody>
-          </table>
-        </div>
-      </div>
-
-      {/* Pagination */}
-      {totalPages > 1 && (
-        <div className="flex items-center justify-between text-[13px]">
-          <span className="text-muted-foreground">
-            Page {page} of {totalPages} · {sorted.length} sessions
-          </span>
-          <div className="flex gap-1">
-            <button
-              onClick={() => { setPage(p => Math.max(1, p - 1)); setFocusedIdx(null) }}
-              disabled={page === 1}
-              className="px-2 py-1 rounded border border-border text-muted-foreground hover:text-foreground hover:border-primary/40 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
-            >
-              ←
-            </button>
-            {(() => {
-              const maxVisible = Math.min(5, totalPages)
-              const startPage = Math.max(1, Math.min(page - 2, totalPages - maxVisible + 1))
-              const numPages = Math.min(maxVisible, totalPages - startPage + 1)
-              const pages = Array.from({ length: numPages }, (_, i) => startPage + i)
-              return pages.map((p) => (
-                <button
-                  key={p}
-                  onClick={() => { setPage(p); setFocusedIdx(null) }}
-                  className={`px-2 py-1 rounded border transition-colors ${p === page ? 'border-primary text-primary' : 'border-border text-muted-foreground hover:text-foreground hover:border-primary/40'}`}
-                >
-                  {p}
-                </button>
-              ))
-            })()}
-            <button
-              onClick={() => { setPage(p => Math.min(totalPages, p + 1)); setFocusedIdx(null) }}
-              disabled={page === totalPages}
-              className="px-2 py-1 rounded border border-border text-muted-foreground hover:text-foreground hover:border-primary/40 disabled:opacity-30 disabled:cursor-not-allowed transition-colors"
-            >
-              →
-            </button>
-          </div>
-        </div>
-      )}
-    </div>
-  )
-}

package/pulse/components/theme-provider.tsx

@@ -1,44 +0,0 @@
-'use client'
-
-import { createContext, useContext, useEffect, useState } from 'react'
-
-type Theme = 'dark' | 'light'
-
-const ThemeContext = createContext<{ theme: Theme; toggle: () => void }>({
-  theme: 'dark',
-  toggle: () => {},
-})
-
-export function useTheme() {
-  return useContext(ThemeContext)
-}
-
-export function ThemeProvider({ children }: { children: React.ReactNode }) {
-  const [theme, setTheme] = useState<Theme>('dark')
-
-  useEffect(() => {
-    const id = window.setTimeout(() => {
-      const stored = localStorage.getItem('theme')
-      const next: Theme = stored === 'light' ? 'light' : 'dark'
-      setTheme(next)
-      document.documentElement.classList.toggle('dark', next === 'dark')
-    }, 0)
-
-    return () => window.clearTimeout(id)
-  }, [])
-
-  function toggle() {
-    setTheme(prev => {
-      const next: Theme = prev === 'dark' ? 'light' : 'dark'
-      localStorage.setItem('theme', next)
-      document.documentElement.classList.toggle('dark', next === 'dark')
-      return next
-    })
-  }
-
-  return (
-    <ThemeContext.Provider value={{ theme, toggle }}>
-      {children}
-    </ThemeContext.Provider>
-  )
-}

package/pulse/components/tools/feature-adoption-table.tsx

@@ -1,58 +0,0 @@
-interface Props {
-  adoption: Record<string, { sessions: number; pct: number }>
-  totalSessions: number
-}
-
-const FEATURE_LABELS: Record<string, { label: string; icon: string }> = {
-  task_agents:      { label: 'Task Agents',        icon: '🤖' },
-  mcp:              { label: 'MCP Servers',         icon: '🔌' },
-  web_search:       { label: 'Web Search',          icon: '🔍' },
-  web_fetch:        { label: 'Web Fetch',           icon: '🌐' },
-  plan_mode:        { label: 'Plan Mode',           icon: '📋' },
-  git_commits:      { label: 'Git Commits',         icon: '📦' },
-  extended_thinking: { label: 'Extended Thinking',  icon: '🧠' },
-}
-
-export function FeatureAdoptionTable({ adoption, totalSessions }: Props) {
-  const rows = Object.entries(adoption)
-    .map(([key, data]) => ({ key, ...data, ...FEATURE_LABELS[key] }))
-    .filter(r => r.label)
-    .sort((a, b) => b.sessions - a.sessions)
-
-  return (
-    <div className="overflow-x-auto">
-      <table className="w-full text-[13px]">
-        <thead>
-          <tr className="border-b border-border">
-            <th className="py-2 text-left text-[12px] font-bold text-muted-foreground uppercase tracking-wider">Feature</th>
-            <th className="py-2 text-right text-[12px] font-bold text-muted-foreground uppercase tracking-wider">Sessions</th>
-            <th className="py-2 text-right text-[12px] font-bold text-muted-foreground uppercase tracking-wider">% of Total</th>
-            <th className="py-2 pl-4 text-left text-[12px] font-bold text-muted-foreground uppercase tracking-wider w-32">Adoption</th>
-          </tr>
-        </thead>
-        <tbody>
-          {rows.map(r => {
-            const pct = (r.pct * 100).toFixed(1)
-            const width = Math.round(r.pct * 100)
-            return (
-              <tr key={r.key} className="border-b border-border/30 hover:bg-muted/30 transition-colors">
-                <td className="py-2">
-                  <span className="mr-1.5">{r.icon}</span>
-                  <span className="text-foreground/80">{r.label}</span>
-                </td>
-                <td className="py-2 text-right text-foreground font-bold">{r.sessions}</td>
-                <td className="py-2 text-right text-[#d97706]">{pct}%</td>
-                <td className="py-2 pl-4">
-                  <div className="h-2 bg-muted rounded-full overflow-hidden w-24">
-                    <div className="h-full rounded-full bg-[#d97706]/60" style={{ width: `${width}%` }} />
-                  </div>
-                </td>
-              </tr>
-            )
-          })}
-        </tbody>
-      </table>
-      <p className="text-[12px] text-muted-foreground/40 mt-2">{totalSessions} total sessions analyzed</p>
-    </div>
-  )
-}

package/pulse/components/tools/mcp-server-panel.tsx

@@ -1,45 +0,0 @@
-import type { McpServerSummary } from '@/types/claude'
-
-interface Props {
-  servers: McpServerSummary[]
-}
-
-export function McpServerPanel({ servers }: Props) {
-  if (servers.length === 0) {
-    return <p className="text-muted-foreground/50 text-[13px]">No MCP server usage detected</p>
-  }
-
-  return (
-    <div className="space-y-4">
-      {servers.map(srv => {
-        const maxCalls = srv.tools[0]?.calls ?? 1
-        return (
-          <div key={srv.server_name} className="border border-border/50 rounded-lg p-3">
-            <div className="flex items-center justify-between mb-2">
-              <span className="text-[13px] font-bold text-[#34d399]">
-                🔌 {srv.server_name}
-              </span>
-              <span className="text-[12px] text-muted-foreground/60">
-                {srv.tools.length} tools · {srv.total_calls.toLocaleString()} calls · {srv.session_count} sessions
-              </span>
-            </div>
-            <div className="space-y-1">
-              {srv.tools.map(t => {
-                const width = Math.max(4, Math.round((t.calls / maxCalls) * 100))
-                return (
-                  <div key={t.name} className="flex items-center gap-2 text-[12px]">
-                    <span className="text-muted-foreground/70 w-32 truncate font-mono">{t.name}</span>
-                    <div className="flex-1 h-1.5 bg-muted rounded-full overflow-hidden">
-                      <div className="h-full rounded-full bg-[#34d399]/50" style={{ width: `${width}%` }} />
-                    </div>
-                    <span className="text-muted-foreground/50 w-12 text-right">{t.calls}</span>
-                  </div>
-                )
-              })}
-            </div>
-          </div>
-        )
-      })}
-    </div>
-  )
-}

package/pulse/components/tools/tool-ranking-chart.tsx

@@ -1,57 +0,0 @@
-'use client'
-
-import { BarChart, Bar, XAxis, YAxis, Tooltip, CartesianGrid, Cell, ResponsiveContainer } from 'recharts'
-import { toolBarColor } from '@/lib/tool-categories'
-import type { ToolSummary } from '@/types/claude'
-
-interface Props {
-  tools: ToolSummary[]
-}
-
-export function ToolRankingChart({ tools }: Props) {
-  const top = tools.slice(0, 20)
-
-  return (
-    <div>
-      <h3 className="text-[13px] font-bold text-muted-foreground uppercase tracking-widest mb-3">
-        Tool Usage — Ranked by Total Calls
-      </h3>
-      <ResponsiveContainer width="100%" height={Math.max(200, top.length * 26)}>
-        <BarChart data={top} layout="vertical" margin={{ top: 0, right: 60, bottom: 0, left: 8 }}>
-          <CartesianGrid strokeDasharray="3 3" stroke="var(--border)" horizontal={false} />
-          <XAxis
-            type="number"
-            tick={{ fontSize: 11, fill: 'var(--muted-foreground)' }}
-            tickLine={false}
-            axisLine={false}
-            tickFormatter={v => v.toLocaleString()}
-          />
-          <YAxis
-            type="category"
-            dataKey="name"
-            tick={{ fontSize: 12, fill: 'var(--muted-foreground)' }}
-            tickLine={false}
-            axisLine={false}
-            width={110}
-          />
-          <Tooltip
-            contentStyle={{ background: 'var(--card)', border: '1px solid var(--border)', borderRadius: 4, fontSize: 12 }}
-            formatter={(val: number | undefined, _name?: string, props?: { payload?: { name?: string } }) => [
-              (val ?? 0).toLocaleString() + ' calls',
-              props?.payload?.name ?? '',
-            ]}
-          />
-          <Bar dataKey="total_calls" radius={[0, 3, 3, 0]}>
-            {top.map((tool, i) => (
-              <Cell
-                key={i}
-                fill={toolBarColor(tool.name)}
-                fillOpacity={0.92}
-              />
-            ))}
-          </Bar>
-        </BarChart>
-      </ResponsiveContainer>
-    </div>
-  )
-}

package/pulse/components/tools/version-history-table.tsx

@@ -1,32 +0,0 @@
-import { formatDate } from '@/lib/decode'
-import type { VersionRecord } from '@/types/claude'
-
-interface Props {
-  versions: VersionRecord[]
-}
-
-export function VersionHistoryTable({ versions }: Props) {
-  return (
-    <div className="overflow-x-auto">
-      <table className="w-full text-[13px] font-mono">
-        <thead>
-          <tr className="border-b border-border">
-            {['Version', 'Sessions', 'First Seen', 'Last Seen'].map(h => (
-              <th key={h} className={`py-2 text-[12px] font-bold text-muted-foreground uppercase tracking-wider ${h === 'Version' ? 'text-left' : 'text-right'}`}>{h}</th>
-            ))}
-          </tr>
-        </thead>
-        <tbody>
-          {versions.map((v, i) => (
-            <tr key={v.version} className={`border-b border-border/30 hover:bg-muted/30 transition-colors ${i === 0 ? 'text-[#34d399]' : 'text-foreground/70'}`}>
-              <td className="py-2 font-bold">{v.version}</td>
-              <td className="py-2 text-right">{v.session_count}</td>
-              <td className="py-2 text-right text-muted-foreground">{v.first_seen ? formatDate(v.first_seen) : '—'}</td>
-              <td className="py-2 text-right text-muted-foreground">{v.last_seen ? formatDate(v.last_seen) : '—'}</td>
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  )
-}

package/pulse/components/ui/alert.tsx

@@ -1,66 +0,0 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "@/lib/utils"
-
-const alertVariants = cva(
-  "relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
-  {
-    variants: {
-      variant: {
-        default: "bg-card text-card-foreground",
-        destructive:
-          "bg-card text-destructive *:data-[slot=alert-description]:text-destructive/90 [&>svg]:text-current",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  }
-)
-
-function Alert({
-  className,
-  variant,
-  ...props
-}: React.ComponentProps<"div"> & VariantProps<typeof alertVariants>) {
-  return (
-    <div
-      data-slot="alert"
-      role="alert"
-      className={cn(alertVariants({ variant }), className)}
-      {...props}
-    />
-  )
-}
-
-function AlertTitle({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-title"
-      className={cn(
-        "col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDescription({
-  className,
-  ...props
-}: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-description"
-      className={cn(
-        "col-start-2 grid justify-items-start gap-1 text-sm text-muted-foreground [&_p]:leading-relaxed",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-export { Alert, AlertTitle, AlertDescription }

package/pulse/components/ui/badge.tsx

@@ -1,48 +0,0 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
-import { Slot } from "radix-ui"
-
-import { cn } from "@/lib/utils"
-
-const badgeVariants = cva(
-  "inline-flex items-center justify-center rounded-full border border-transparent px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-        secondary:
-          "bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-        destructive:
-          "bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline:
-          "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-        ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 [a&]:hover:underline",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  }
-)
-
-function Badge({
-  className,
-  variant = "default",
-  asChild = false,
-  ...props
-}: React.ComponentProps<"span"> &
-  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
-  const Comp = asChild ? Slot.Root : "span"
-
-  return (
-    <Comp
-      data-slot="badge"
-      data-variant={variant}
-      className={cn(badgeVariants({ variant }), className)}
-      {...props}
-    />
-  )
-}
-
-export { Badge, badgeVariants }