fix: Allows triggers on dropdown and fixes filtering (unkeyed#2748)

* Fix button triggers Remove asChild to allow trigger from buttons * remove as child Removing as child to allow for correct triggers * Fix filtering Fix filter to work as expected --------- Co-authored-by: James Perkins <jamesperkins@Jamess-MacBook-Air.local>
BadriVishalPadhy · Dec 13, 2024 · 74f8359 · 74f8359
1 parent 580c165
commit 74f8359
Show file tree

Hide file tree

Showing 10 changed files with 11 additions and 12 deletions.
diff --git a/apps/dashboard/app/(app)/audit/[bucket]/filter.tsx b/apps/dashboard/app/(app)/audit/[bucket]/filter.tsx
@@ -35,7 +35,7 @@ export const Filter: React.FC<Props> = ({ options, title, param }) => {
 
   return (
     <Popover>
-      <PopoverTrigger asChild>
+      <PopoverTrigger>
         <Button className="flex items-center h-8 gap-2 ">
           {title}
           {selected.length > 0 && (
@@ -70,10 +70,9 @@ export const Filter: React.FC<Props> = ({ options, title, param }) => {
             <CommandGroup>
               {options.map((option) => {
                 const isSelected = selected.includes(option.value);
-
                 return (
                   <div
-                    onMouseDownCapture={() => {
+                    onClick={() => {
                       const next = isSelected
                         ? selected.filter((v) => v !== option.value)
                         : Array.from(new Set([...selected, option.value]));

diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/filter.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/filter.tsx
@@ -86,7 +86,7 @@ export const Filters: React.FC = () => {
     <div className="flex flex-col w-full gap-2">
       <div className="flex items-center justify-end w-full gap-2">
         <DropdownMenu>
-          <DropdownMenuTrigger asChild>
+          <DropdownMenuTrigger>
             <Button className="text-xs">
               Add Filter <ChevronDown className="w-4 h-4" />
             </Button>

diff --git a/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/menu.tsx b/apps/dashboard/app/(app)/ratelimits/[namespaceId]/logs/menu.tsx
@@ -29,7 +29,7 @@ export const Menu: React.FC<Props> = ({ namespace, identifier }) => {
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
+      <DropdownMenuTrigger>
         <Button variant="ghost" shape="square">
           <MoreHorizontal className="w-4 h-4" />
         </Button>

diff --git a/apps/dashboard/app/(app)/settings/user/update-user-email.tsx b/apps/dashboard/app/(app)/settings/user/update-user-email.tsx
@@ -123,7 +123,7 @@ export const UpdateUserEmail: React.FC = () => {
 
                     <TableCell align="right">
                       <DropdownMenu>
-                        <DropdownMenuTrigger asChild>
+                        <DropdownMenuTrigger>
                           <Button variant="ghost">
                             <MoreHorizontal className="w-4 h-4" />
                           </Button>

diff --git a/apps/dashboard/components/dashboard/api-key-table/index.tsx b/apps/dashboard/components/dashboard/api-key-table/index.tsx
@@ -235,7 +235,7 @@ export const ApiKeyTable: React.FC<Props> = ({ data }) => {
         <div>
           <Dialog>
             <DropdownMenu>
-              <DropdownMenuTrigger asChild>
+              <DropdownMenuTrigger>
                 <Button variant="ghost" className="w-8 h-8 p-0">
                   <span className="sr-only">Open menu</span>
                   <MoreHorizontal className="w-4 h-4" />

diff --git a/apps/dashboard/components/dashboard/api-key-table/table.tsx b/apps/dashboard/components/dashboard/api-key-table/table.tsx
@@ -133,7 +133,7 @@ export function DataTable<TData, TValue>({ data, columns }: DataTableProps<TData
             className="max-w-sm md:max-w-2xl"
           />
           <DropdownMenu>
-            <DropdownMenuTrigger asChild>
+            <DropdownMenuTrigger>
               <Button className="min-w-full mt-4 ml-0 md:min-w-min md:mt-0 md:ml-auto">
                 Columns
               </Button>

diff --git a/apps/dashboard/components/dashboard/root-key-table/index.tsx b/apps/dashboard/components/dashboard/root-key-table/index.tsx
@@ -155,7 +155,7 @@ export const RootKeyTable: React.FC<Props> = ({ data }) => {
         <div>
           <Dialog>
             <DropdownMenu>
-              <DropdownMenuTrigger asChild>
+              <DropdownMenuTrigger>
                 <Button variant="ghost" className="w-8 h-8 p-0">
                   <span className="sr-only">Open menu</span>
                   <MoreHorizontal className="w-4 h-4" />

diff --git a/apps/dashboard/components/dashboard/root-key-table/table.tsx b/apps/dashboard/components/dashboard/root-key-table/table.tsx
@@ -133,7 +133,7 @@ export function DataTable<TData, TValue>({ data, columns }: DataTableProps<TData
             className="max-w-sm md:max-w-2xl"
           />
           <DropdownMenu>
-            <DropdownMenuTrigger asChild>
+            <DropdownMenuTrigger>
               <Button className="min-w-full mt-4 ml-0 md:min-w-min md:mt-0 md:ml-auto">
                 Columns
               </Button>

diff --git a/apps/dashboard/components/data-table/column-header.tsx b/apps/dashboard/components/data-table/column-header.tsx
@@ -27,7 +27,7 @@ export function DataTableColumnHeader<TData, TValue>({
   return (
     <div className={cn("flex items-center space-x-2", className)}>
       <DropdownMenu>
-        <DropdownMenuTrigger asChild>
+        <DropdownMenuTrigger>
           <Button variant="ghost" className="h-8 -ml-3">
             <span>{title}</span>
             {column.getIsSorted() === "desc" ? (

diff --git a/apps/dashboard/components/data-table/view-options.tsx b/apps/dashboard/components/data-table/view-options.tsx
@@ -20,7 +20,7 @@ interface DataTableViewOptionsProps<TData> {
 export function DataTableViewOptions<TData>({ table }: DataTableViewOptionsProps<TData>) {
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
+      <DropdownMenuTrigger>
         <Button className="hidden h-8 ml-auto lg:flex">
           <ListFilter className="w-4 h-4 mr-2" />
           View