diff --git a/src/frontend/src/components/Feedback.tsx b/src/frontend/src/components/Feedback.tsx index 7d995e5c..3929da9e 100644 --- a/src/frontend/src/components/Feedback.tsx +++ b/src/frontend/src/components/Feedback.tsx @@ -1,12 +1,12 @@ -import { Button } from '@/primitives' import { css } from '@/styled-system/css' import { RiExternalLinkLine } from '@remixicon/react' import { useTranslation } from 'react-i18next' +import { LinkButton } from '@/primitives' export const Feedback = () => { const { t } = useTranslation() return ( - + ) } diff --git a/src/frontend/src/primitives/Button.tsx b/src/frontend/src/primitives/Button.tsx index 6b3d4ec9..ab2a46bf 100644 --- a/src/frontend/src/primitives/Button.tsx +++ b/src/frontend/src/primitives/Button.tsx @@ -1,8 +1,6 @@ import { Button as RACButton, type ButtonProps as RACButtonsProps, - Link, - LinkProps, } from 'react-aria-components' import { type RecipeVariantProps } from '@/styled-system/css' import { buttonRecipe, type ButtonRecipe } from './buttonRecipe' @@ -12,25 +10,12 @@ export type ButtonProps = RecipeVariantProps & RACButtonsProps & TooltipWrapperProps -type LinkButtonProps = RecipeVariantProps & - LinkProps & - TooltipWrapperProps - -type ButtonOrLinkProps = ButtonProps | LinkButtonProps - export const Button = ({ tooltip, tooltipType = 'instant', ...props -}: ButtonOrLinkProps) => { +}: ButtonProps) => { const [variantProps, componentProps] = buttonRecipe.splitVariantProps(props) - if ((props as LinkButtonProps).href !== undefined) { - return ( - - - - ) - } return ( diff --git a/src/frontend/src/primitives/LinkButton.tsx b/src/frontend/src/primitives/LinkButton.tsx new file mode 100644 index 00000000..1397da5c --- /dev/null +++ b/src/frontend/src/primitives/LinkButton.tsx @@ -0,0 +1,22 @@ +import { Link, LinkProps } from 'react-aria-components' +import { type RecipeVariantProps } from '@/styled-system/css' +import { buttonRecipe, type ButtonRecipe } from './buttonRecipe' +import { TooltipWrapper, type TooltipWrapperProps } from './TooltipWrapper' + +type LinkButtonProps = RecipeVariantProps & + LinkProps & + TooltipWrapperProps + +export const LinkButton = ({ + tooltip, + tooltipType = 'instant', + ...props +}: LinkButtonProps) => { + const [variantProps, componentProps] = buttonRecipe.splitVariantProps(props) + + return ( + + + + ) +} diff --git a/src/frontend/src/primitives/index.ts b/src/frontend/src/primitives/index.ts index 16a0ffc0..44d68b9c 100644 --- a/src/frontend/src/primitives/index.ts +++ b/src/frontend/src/primitives/index.ts @@ -9,6 +9,7 @@ export { Badge } from './Badge' export { Bold } from './Bold' export { Box } from './Box' export { Button } from './Button' +export { LinkButton } from './LinkButton' export { useCloseDialog } from './useCloseDialog' export { Dialog, type DialogProps } from './Dialog' export { Div } from './Div'