DropdownControl() — supabase Function Reference

Source Code

apps/studio/components/grid/components/common/DropdownControl.tsx lines 20–54

export const DropdownControl = ({
  children,
  side,
  align,
  options,
  onSelect,
  className,
}: PropsWithChildren<DropdownControlProps>) => {
  return (
    <DropdownMenu>
      <DropdownMenuTrigger className={className}>{children}</DropdownMenuTrigger>
      <DropdownMenuContent side={side} align={align}>
        <div className="dropdown-control" style={{ maxHeight: '30vh' }}>
          {options.length === 0 && <p className="dropdown-control__empty-text">No more items</p>}
          {options.map((x) => {
            return (
              <DropdownMenuItemTooltip
                key={x.value}
                disabled={x.disabled}
                tooltip={{ content: { side: 'right', text: x.tooltip } }}
                onClick={() => onSelect(x.value)}
              >
                <div className="flex items-center gap-2">
                  {x.preLabel && <span className="grow text-foreground-lighter">{x.preLabel}</span>}
                  <span>{x.label}</span>
                  {x.postLabel && <span className="text-foreground-lighter">{x.postLabel}</span>}
                </div>
              </DropdownMenuItemTooltip>
            )
          })}
        </div>
      </DropdownMenuContent>
    </DropdownMenu>
  )
}