-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Adding prebuild status filter to repo configs list ui (#19205)
* Adding prebuildsEnabled filter to projects search query * adding prebuilds_enabled param * stubbing out UI for prebuild status filter * mark prebuilds_enabled as optional so we have an undefined state * ui stuff * whoopsie * drop animations for now * comments * cleanup * convert to string * consider prebuild filter in showing table * add prebuilds query param * fix issue w/ fragment around routes preventing 404 handler
- Loading branch information
1 parent
277c9da
commit 85fb744
Showing
15 changed files
with
470 additions
and
138 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
161 changes: 161 additions & 0 deletions
161
components/dashboard/src/components/podkit/select/Select.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,161 @@ | ||
/** | ||
* Copyright (c) 2023 Gitpod GmbH. All rights reserved. | ||
* Licensed under the GNU Affero General Public License (AGPL). | ||
* See License.AGPL.txt in the project root for license information. | ||
*/ | ||
|
||
import * as React from "react"; | ||
import * as SelectPrimitive from "@radix-ui/react-select"; | ||
import { Check, ChevronDown, ChevronUp } from "lucide-react"; | ||
import { cn } from "@podkit/lib/cn"; | ||
|
||
const Select = SelectPrimitive.Root; | ||
|
||
const SelectGroup = SelectPrimitive.Group; | ||
|
||
const SelectValue = SelectPrimitive.Value; | ||
|
||
const SelectTrigger = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.Trigger>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> | ||
>(({ className, children, ...props }, ref) => ( | ||
<SelectPrimitive.Trigger | ||
ref={ref} | ||
className={cn( | ||
"flex items-center justify-between w-full max-w-lg", | ||
"rounded-lg py-[7px] px-2", | ||
"text-sm text-pk-content-primary placeholder:text-pk-content-tertiary", | ||
"bg-pk-surface-primary", | ||
"border border-pk-border-base", | ||
"text-sm", | ||
"hover:[&_svg]:text-pk-content-primary", | ||
"focus:outline-none focus-visible:ring-4 focus-visible:ring-ring", | ||
"disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1", | ||
className, | ||
)} | ||
{...props} | ||
> | ||
{children} | ||
<SelectPrimitive.Icon asChild> | ||
<ChevronDown className="h-4 w-4 text-pk-content-disabled" /> | ||
</SelectPrimitive.Icon> | ||
</SelectPrimitive.Trigger> | ||
)); | ||
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; | ||
|
||
const SelectScrollUpButton = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.ScrollUpButton>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton> | ||
>(({ className, ...props }, ref) => ( | ||
<SelectPrimitive.ScrollUpButton | ||
ref={ref} | ||
className={cn("flex cursor-default items-center justify-center py-1", className)} | ||
{...props} | ||
> | ||
<ChevronUp className="h-4 w-4" /> | ||
</SelectPrimitive.ScrollUpButton> | ||
)); | ||
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; | ||
|
||
const SelectScrollDownButton = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.ScrollDownButton>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton> | ||
>(({ className, ...props }, ref) => ( | ||
<SelectPrimitive.ScrollDownButton | ||
ref={ref} | ||
className={cn("flex cursor-default items-center justify-center py-1", className)} | ||
{...props} | ||
> | ||
<ChevronDown className="h-4 w-4" /> | ||
</SelectPrimitive.ScrollDownButton> | ||
)); | ||
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName; | ||
|
||
const SelectContent = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.Content>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content> | ||
>(({ className, children, position = "popper", ...props }, ref) => ( | ||
<SelectPrimitive.Portal> | ||
<SelectPrimitive.Content | ||
ref={ref} | ||
className={cn( | ||
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden", | ||
"rounded-lg border border-pk-border-base", | ||
"bg-pk-surface-primary text-pk-content-primary shadow-md", | ||
position === "popper" && | ||
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", | ||
className, | ||
)} | ||
position={position} | ||
{...props} | ||
> | ||
<SelectScrollUpButton /> | ||
<SelectPrimitive.Viewport | ||
className={cn( | ||
"p-1", | ||
position === "popper" && | ||
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]", | ||
)} | ||
> | ||
{children} | ||
</SelectPrimitive.Viewport> | ||
<SelectScrollDownButton /> | ||
</SelectPrimitive.Content> | ||
</SelectPrimitive.Portal> | ||
)); | ||
SelectContent.displayName = SelectPrimitive.Content.displayName; | ||
|
||
const SelectLabel = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.Label>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label> | ||
>(({ className, ...props }, ref) => ( | ||
<SelectPrimitive.Label ref={ref} className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)} {...props} /> | ||
)); | ||
SelectLabel.displayName = SelectPrimitive.Label.displayName; | ||
|
||
const SelectItem = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.Item>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item> | ||
>(({ className, children, ...props }, ref) => ( | ||
<SelectPrimitive.Item | ||
ref={ref} | ||
className={cn( | ||
"relative flex w-full cursor-default items-center select-none", | ||
"rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none", | ||
"focus:bg-pk-surface-tertiary focus:text-accent-foreground", | ||
"data-[disabled]:pointer-events-none data-[disabled]:opacity-50", | ||
className, | ||
)} | ||
{...props} | ||
> | ||
<span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> | ||
<SelectPrimitive.ItemIndicator> | ||
<Check className="h-4 w-4" /> | ||
</SelectPrimitive.ItemIndicator> | ||
</span> | ||
|
||
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText> | ||
</SelectPrimitive.Item> | ||
)); | ||
SelectItem.displayName = SelectPrimitive.Item.displayName; | ||
|
||
const SelectSeparator = React.forwardRef< | ||
React.ElementRef<typeof SelectPrimitive.Separator>, | ||
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator> | ||
>(({ className, ...props }, ref) => ( | ||
<SelectPrimitive.Separator ref={ref} className={cn("-mx-1 my-1 h-px bg-pk-border-base", className)} {...props} /> | ||
)); | ||
SelectSeparator.displayName = SelectPrimitive.Separator.displayName; | ||
|
||
export { | ||
Select, | ||
SelectGroup, | ||
SelectValue, | ||
SelectTrigger, | ||
SelectContent, | ||
SelectLabel, | ||
SelectItem, | ||
SelectSeparator, | ||
SelectScrollUpButton, | ||
SelectScrollDownButton, | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.