add useMobile

This commit is contained in:
Athou
2023-06-21 09:13:20 +02:00
parent 4f644ba9f5
commit 91d0988177
5 changed files with 13 additions and 10 deletions

View File

@@ -1,7 +1,7 @@
import { ActionIcon, Button, Tooltip, useMantineTheme } from "@mantine/core"
import { ActionIconProps } from "@mantine/core/lib/ActionIcon/ActionIcon"
import { ButtonProps } from "@mantine/core/lib/Button/Button"
import { useMediaQuery } from "@mantine/hooks"
import { useMobile } from "hooks/useMobile"
import { forwardRef, MouseEventHandler, ReactNode } from "react"
interface ActionButtonProps {
@@ -20,7 +20,7 @@ interface ActionButtonProps {
export const ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>((props: ActionButtonProps, ref) => {
const theme = useMantineTheme()
const variant = props.variant ?? "subtle"
const mobile = !useMediaQuery(`(min-width: ${theme.breakpoints.lg})`)
const mobile = useMobile(theme.breakpoints.lg)
const iconOnly = (mobile && !props.showLabelOnMobile) || (!mobile && props.hideLabelOnDesktop)
return iconOnly ? (
<Tooltip label={props.label} openDelay={500}>