From c3e300a4242f56675e1709a90a8145a8c035c0d1 Mon Sep 17 00:00:00 2001 From: Mikiyas Tibebu Date: Fri, 14 Jun 2024 12:03:29 +0300 Subject: [PATCH 1/4] Added page information to DataTable component --- ui/src/components/ui/data-table.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/ui/src/components/ui/data-table.tsx b/ui/src/components/ui/data-table.tsx index fc5d7a4..c05d44a 100644 --- a/ui/src/components/ui/data-table.tsx +++ b/ui/src/components/ui/data-table.tsx @@ -85,6 +85,10 @@ export function DataTable({
+
+ Page {table.getState().pagination.pageIndex + 1} of{" "} + {table.getPageCount().toLocaleString()} page(s). +
-
-
+
+
Page {table.getState().pagination.pageIndex + 1} of{" "} {table.getPageCount().toLocaleString()} page(s).
- - + +
+
); diff --git a/ui/src/components/ui/select.tsx b/ui/src/components/ui/select.tsx new file mode 100644 index 0000000..fe56d4d --- /dev/null +++ b/ui/src/components/ui/select.tsx @@ -0,0 +1,158 @@ +import * as React from "react" +import * as SelectPrimitive from "@radix-ui/react-select" +import { Check, ChevronDown, ChevronUp } from "lucide-react" + +import { cn } from "@/lib/utils" + +const Select = SelectPrimitive.Root + +const SelectGroup = SelectPrimitive.Group + +const SelectValue = SelectPrimitive.Value + +const SelectTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + span]:line-clamp-1", + className + )} + {...props} + > + {children} + + + + +)) +SelectTrigger.displayName = SelectPrimitive.Trigger.displayName + +const SelectScrollUpButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)) +SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName + +const SelectScrollDownButton = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)) +SelectScrollDownButton.displayName = + SelectPrimitive.ScrollDownButton.displayName + +const SelectContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, position = "popper", ...props }, ref) => ( + + + + + {children} + + + + +)) +SelectContent.displayName = SelectPrimitive.Content.displayName + +const SelectLabel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SelectLabel.displayName = SelectPrimitive.Label.displayName + +const SelectItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + + + + + + + {children} + +)) +SelectItem.displayName = SelectPrimitive.Item.displayName + +const SelectSeparator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SelectSeparator.displayName = SelectPrimitive.Separator.displayName + +export { + Select, + SelectGroup, + SelectValue, + SelectTrigger, + SelectContent, + SelectLabel, + SelectItem, + SelectSeparator, + SelectScrollUpButton, + SelectScrollDownButton, +} From 59ab4a36ed9f8f8b6f1126ec9d1989e4ee675b4f Mon Sep 17 00:00:00 2001 From: Mikiyas Tibebu Date: Fri, 14 Jun 2024 12:52:26 +0300 Subject: [PATCH 3/4] fix header z height issue --- ui/src/routes/__root.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/src/routes/__root.tsx b/ui/src/routes/__root.tsx index edb844c..b661f1a 100644 --- a/ui/src/routes/__root.tsx +++ b/ui/src/routes/__root.tsx @@ -21,7 +21,7 @@ export function Root() { return ( <>
-
+
- +
+ +
); diff --git a/ui/src/routes/tables.lazy.tsx b/ui/src/routes/tables.lazy.tsx index 6281c1c..d78a8fe 100644 --- a/ui/src/routes/tables.lazy.tsx +++ b/ui/src/routes/tables.lazy.tsx @@ -55,7 +55,7 @@ function Table({ name }: Props) { [key: string]: string; }; const columns: ColumnDef[] = data.columns.map((col) => ({ - accessorKey: col.toLowerCase(), + accessorKey: col, header: col, })); const rows = data.rows.map((row) =>