Skip to content

Commit 4964c07

Browse files
authored
feat: reexport shadcn components and theme (#2)
1 parent da150f2 commit 4964c07

File tree

117 files changed

+7339
-3110
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

117 files changed

+7339
-3110
lines changed

apps/dev-playground/client/package-lock.json

Lines changed: 362 additions & 778 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

apps/dev-playground/client/package.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,8 @@
2525
"react-dom": "^19.1.1",
2626
"recharts": "^3.4.1",
2727
"tailwind-merge": "^3.3.1",
28-
"tailwindcss-animate": "^1.0.7"
28+
"tailwindcss-animate": "^1.0.7",
29+
"tw-animate-css": "^1.4.0"
2930
},
3031
"devDependencies": {
3132
"@eslint/js": "^9.36.0",
@@ -41,7 +42,8 @@
4142
"globals": "^16.4.0",
4243
"postcss": "^8.5.6",
4344
"shiki": "^3.15.0",
44-
"tailwindcss": "^3.4.18",
45+
"tailwindcss": "^4.1.17",
46+
"@tailwindcss/postcss": "^4.1.17",
4547
"typescript": "~5.9.3",
4648
"typescript-eslint": "^8.45.0",
4749
"vite": "npm:[email protected]"
Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,6 @@
1-
import path from "node:path";
2-
3-
const __dirname = path.dirname(new URL(import.meta.url).pathname);
4-
51
export default {
62
plugins: {
7-
tailwindcss: { config: path.resolve(__dirname, "./tailwind.config.ts") },
3+
"@tailwindcss/postcss": {},
84
autoprefixer: {},
95
},
106
};

apps/dev-playground/client/src/components/analytics/analytics-header.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@ import { DatabricksLogo } from "./databricks-logo";
22

33
export function AnalyticsHeader() {
44
return (
5-
<header className="bg-white border-b border-gray-200 p-4">
5+
<header className="bg-background border-b border-gray-200 p-4">
66
<div className="max-w-7xl mx-auto flex items-center justify-between">
77
<div className="flex items-center gap-4 items-center">
88
<DatabricksLogo />
9-
<p className="leading-7">Apps Cost Insights</p>
9+
<p className="leading-7 text-foreground">Apps Cost Insights</p>
1010
</div>
11-
<div className="w-8 h-8 bg-databricks-red rounded-full flex items-center justify-center">
12-
<span className="text-white text-sm font-medium">S</span>
11+
<div className="w-8 h-8 bg-destructive rounded-full flex items-center justify-center">
12+
<span className="text-foreground text-sm font-medium">S</span>
1313
</div>
1414
</div>
1515
</header>

apps/dev-playground/client/src/components/analytics/filter-bar.tsx

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
import { Card, CardContent } from "@/components/ui/card";
1+
import type { Aggregation, DashboardFilters } from "@/lib/types";
22
import {
3+
Card,
4+
CardContent,
35
Select,
46
SelectContent,
57
SelectItem,
68
SelectTrigger,
79
SelectValue,
8-
} from "@/components/ui/select";
9-
import type { Aggregation, DashboardFilters } from "@/lib/types";
10+
} from "@databricks/app-kit-ui/react";
1011

1112
interface FilterBarProps {
1213
filters: DashboardFilters;

apps/dev-playground/client/src/components/analytics/summary-cards.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import {
33
CardDescription,
44
CardHeader,
55
CardTitle,
6-
} from "@/components/ui/card";
7-
import { Skeleton } from "@/components/ui/skeleton";
6+
Skeleton,
7+
} from "@databricks/app-kit-ui/react";
88
import type { Aggregation, DashboardFilters } from "@/lib/types";
99

1010
interface SummaryCardsProps {

apps/dev-playground/client/src/components/analytics/top-contributors-chart.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,15 @@
1-
import { BarChart } from "@databricks/app-kit-ui/react";
2-
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
31
import {
2+
BarChart,
3+
Card,
4+
CardContent,
5+
CardHeader,
6+
CardTitle,
47
Select,
58
SelectContent,
69
SelectItem,
710
SelectTrigger,
811
SelectValue,
9-
} from "@/components/ui/select";
12+
} from "@databricks/app-kit-ui/react";
1013

1114
interface TopContributorsChartProps {
1215
groupBy: "app" | "user";

apps/dev-playground/client/src/components/analytics/untagged-apps-table.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {
55
CardDescription,
66
CardHeader,
77
CardTitle,
8-
} from "@/components/ui/card";
8+
} from "@databricks/app-kit-ui/react";
99

1010
interface UntaggedApp {
1111
id: string;

apps/dev-playground/client/src/components/analytics/usage-trends-chart.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,16 @@
11
import { sql } from "@databricks/app-kit-ui/js";
22
import { BarChart } from "@databricks/app-kit-ui/react";
3-
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
43
import {
4+
Card,
5+
CardContent,
6+
CardHeader,
7+
CardTitle,
58
Select,
69
SelectContent,
710
SelectItem,
811
SelectTrigger,
912
SelectValue,
10-
} from "@/components/ui/select";
13+
} from "@databricks/app-kit-ui/react";
1114

1215
interface UsageTrendsChartProps {
1316
groupBy: "default" | "app" | "user";

apps/dev-playground/client/src/components/apps-data-table.tsx

Lines changed: 21 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,18 @@
1+
import {
2+
Badge,
3+
Button,
4+
DropdownMenu,
5+
DropdownMenuCheckboxItem,
6+
DropdownMenuContent,
7+
DropdownMenuTrigger,
8+
Input,
9+
Table,
10+
TableBody,
11+
TableCell,
12+
TableHead,
13+
TableHeader,
14+
TableRow,
15+
} from "@databricks/app-kit-ui/react";
116
import {
217
type ColumnDef,
318
type ColumnFiltersState,
@@ -12,23 +27,6 @@ import {
1227
} from "@tanstack/react-table";
1328
import { ArrowUpDown, ChevronDown } from "lucide-react";
1429
import * as React from "react";
15-
import { Button } from "@/components/ui/button";
16-
import {
17-
DropdownMenu,
18-
DropdownMenuCheckboxItem,
19-
DropdownMenuContent,
20-
DropdownMenuTrigger,
21-
} from "@/components/ui/dropdown-menu";
22-
import { Input } from "@/components/ui/input";
23-
import {
24-
Table,
25-
TableBody,
26-
TableCell,
27-
TableHead,
28-
TableHeader,
29-
TableRow,
30-
} from "@/components/ui/table";
31-
import { Badge } from "./ui/badge";
3230

3331
export type AppData = {
3432
id: string;
@@ -86,7 +84,7 @@ export const columns: ColumnDef<AppData>[] = [
8684
</Badge>
8785
))
8886
) : (
89-
<span className="text-xs text-gray-400">No tags</span>
87+
<span className="text-xs text-muted-foreground">No tags</span>
9088
)}
9189
</div>
9290
);
@@ -162,13 +160,13 @@ export function AppsDataTable({ data, loading = false }: AppsDataTableProps) {
162160
return (
163161
<div className="w-full space-y-3">
164162
<div className="flex items-center justify-between">
165-
<div className="h-10 w-64 bg-gray-200 animate-pulse rounded" />
166-
<div className="h-10 w-24 bg-gray-200 animate-pulse rounded" />
163+
<div className="h-10 w-64 bg-muted animate-pulse rounded" />
164+
<div className="h-10 w-24 bg-muted animate-pulse rounded" />
167165
</div>
168166
<div className="border rounded-md">
169167
{["row-1", "row-2", "row-3", "row-4", "row-5"].map((id) => (
170168
<div key={id} className="flex gap-4 p-4 border-b last:border-b-0">
171-
<div className="h-6 w-full bg-gray-200 animate-pulse rounded" />
169+
<div className="h-6 w-full bg-muted animate-pulse rounded" />
172170
</div>
173171
))}
174172
</div>
@@ -214,10 +212,10 @@ export function AppsDataTable({ data, loading = false }: AppsDataTableProps) {
214212
</DropdownMenuContent>
215213
</DropdownMenu>
216214
</div>
217-
<div className="overflow-hidden rounded-md border">
215+
<div className="overflow-hidden rounded-md border border-border">
218216
<div className="max-h-[600px] overflow-y-auto">
219217
<Table>
220-
<TableHeader className="sticky top-0 bg-white z-10">
218+
<TableHeader className="sticky top-0 bg-background z-10">
221219
{table.getHeaderGroups().map((headerGroup) => (
222220
<TableRow key={headerGroup.id}>
223221
{headerGroup.headers.map((header) => {

0 commit comments

Comments
 (0)