wrap all instances of mantine hooks used in renderer

src/renderer/components/item-list/item-detail-list/item-detail-list.tsx

@@ -1,4 +1,3 @@
-import { useElementSize, useMergedRef } from '@mantine/hooks';
 import { throttle } from 'lodash';
 import { AnimatePresence, motion, Variants } from 'motion/react';
 import { useOverlayScrollbars } from 'overlayscrollbars-react';
@@ -20,6 +19,8 @@ import styles from './item-detail-list.module.css';
 import { ItemDetail } from '/@/renderer/components/item-detail/item-detail';
 import { ExpandedListItem } from '/@/renderer/components/item-list/expanded-list-item';
 import { useItemListState } from '/@/renderer/components/item-list/helpers/item-list-state';
+import { useElementSize } from '/@/shared/hooks/use-element-size';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem } from '/@/shared/types/domain-types';
 
 export interface ItemDetailListProps {
@@ -123,9 +124,9 @@ export const ItemDetailList = ({
         (_e: MouseEvent<HTMLDivElement>, item: unknown, itemType: LibraryItem) => {
             if (item && typeof item === 'object' && 'id' in item && 'serverId' in item) {
                 internalState.toggleExpanded({
+                    _serverId: item.serverId as string,
                     id: item.id as string,
                     itemType: itemType,
-                    _serverId: item.serverId as string,
                 });
             }
         },

src/renderer/components/item-list/item-grid-list/item-grid-list.tsx

@@ -1,4 +1,3 @@
-import { useElementSize, useMergedRef } from '@mantine/hooks';
 import clsx from 'clsx';
 import throttle from 'lodash/throttle';
 import { AnimatePresence } from 'motion/react';
@@ -42,6 +41,8 @@ import {
     useItemListState,
 } from '/@/renderer/components/item-list/helpers/item-list-state';
 import { ItemControls, ItemListHandle } from '/@/renderer/components/item-list/types';
+import { useElementSize } from '/@/shared/hooks/use-element-size';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem } from '/@/shared/types/domain-types';
 
 interface VirtualizedGridListProps {

src/renderer/components/item-list/item-table-list/item-table-list-column.tsx

@@ -9,7 +9,6 @@ import {
     dropTargetForElements,
 } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { disableNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview';
-import { useMergedRef } from '@mantine/hooks';
 import clsx from 'clsx';
 import React, { CSSProperties, ReactElement, ReactNode, useEffect, useRef, useState } from 'react';
 import { CellComponentProps } from 'react-window-v2';
@@ -48,6 +47,7 @@ import { Icon } from '/@/shared/components/icon/icon';
 import { Skeleton } from '/@/shared/components/skeleton/skeleton';
 import { Text } from '/@/shared/components/text/text';
 import { useDoubleClick } from '/@/shared/hooks/use-double-click';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem, QueueSong, Song } from '/@/shared/types/domain-types';
 import {
     dndUtils,

src/renderer/components/item-list/item-table-list/item-table-list.tsx

@@ -1,7 +1,6 @@
 // Component adapted from https://github.com/bvaughn/react-window/issues/826
 
 import { autoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/element';
-import { useMergedRef } from '@mantine/hooks';
 import clsx from 'clsx';
 import { AnimatePresence } from 'motion/react';
 import { useOverlayScrollbars } from 'overlayscrollbars-react';
@@ -39,6 +38,7 @@ import {
     ItemTableListColumnConfig,
 } from '/@/renderer/components/item-list/types';
 import { PlayerContext, usePlayer } from '/@/renderer/features/player/context/player-context';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem } from '/@/shared/types/domain-types';
 import { TableColumn } from '/@/shared/types/types';
 

src/renderer/components/native-scroll-area/native-scroll-area.tsx

@@ -1,4 +1,3 @@
-import { useMergedRef } from '@mantine/hooks';
 import { useInView } from 'motion/react';
 import { useOverlayScrollbars } from 'overlayscrollbars-react';
 import { CSSProperties, forwardRef, ReactNode, Ref, useEffect, useRef, useState } from 'react';
@@ -7,6 +6,7 @@ import styles from './native-scroll-area.module.css';
 
 import { PageHeader, PageHeaderProps } from '/@/renderer/components/page-header/page-header';
 import { useWindowSettings } from '/@/renderer/store/settings.store';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { Platform } from '/@/shared/types/types';
 
 interface NativeScrollAreaProps {

src/renderer/features/albums/components/expanded-album-list-item.tsx

@@ -1,4 +1,3 @@
-import { useMergedRef } from '@mantine/hooks';
 import { useSuspenseQuery } from '@tanstack/react-query';
 import clsx from 'clsx';
 import formatDuration from 'format-duration';
@@ -25,6 +24,7 @@ import { Separator } from '/@/shared/components/separator/separator';
 import { Spinner } from '/@/shared/components/spinner/spinner';
 import { TextTitle } from '/@/shared/components/text-title/text-title';
 import { Text } from '/@/shared/components/text/text';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem, Song } from '/@/shared/types/domain-types';
 import { DragOperation, DragTarget, DragTargetMap } from '/@/shared/types/drag-and-drop';
 

src/renderer/features/lyrics/components/lyrics-search-form.tsx

@@ -1,5 +1,4 @@
 import { useForm } from '@mantine/form';
-import { useDebouncedValue } from '@mantine/hooks';
 import { openModal } from '@mantine/modals';
 import { useQuery } from '@tanstack/react-query';
 import orderBy from 'lodash/orderBy';
@@ -17,6 +16,7 @@ import { Spinner } from '/@/shared/components/spinner/spinner';
 import { Stack } from '/@/shared/components/stack/stack';
 import { TextInput } from '/@/shared/components/text-input/text-input';
 import { Text } from '/@/shared/components/text/text';
+import { useDebouncedValue } from '/@/shared/hooks/use-debounced-value';
 import {
     InternetProviderLyricSearchResponse,
     LyricSource,

src/renderer/features/now-playing/components/play-queue.tsx

@@ -1,4 +1,3 @@
-import { useDebouncedValue, useMergedRef } from '@mantine/hooks';
 import clsx from 'clsx';
 import { forwardRef, ReactElement, useEffect, useMemo, useRef, useState } from 'react';
 
@@ -25,6 +24,8 @@ import { searchSongs } from '/@/renderer/utils/search-songs';
 import { Flex } from '/@/shared/components/flex/flex';
 import { LoadingOverlay } from '/@/shared/components/loading-overlay/loading-overlay';
 import { Text } from '/@/shared/components/text/text';
+import { useDebouncedValue } from '/@/shared/hooks/use-debounced-value';
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { LibraryItem, QueueSong, Song } from '/@/shared/types/domain-types';
 import { DragTarget } from '/@/shared/types/drag-and-drop';
 import { ItemListKey, Play, PlayerQueueType } from '/@/shared/types/types';

src/renderer/features/player/components/full-screen-player-image.tsx

@@ -1,4 +1,3 @@
-import { useSetState } from '@mantine/hooks';
 import clsx from 'clsx';
 import { AnimatePresence, HTMLMotionProps, motion, Variants } from 'motion/react';
 import { Fragment, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
@@ -18,6 +17,7 @@ import { Group } from '/@/shared/components/group/group';
 import { Icon } from '/@/shared/components/icon/icon';
 import { Stack } from '/@/shared/components/stack/stack';
 import { Text } from '/@/shared/components/text/text';
+import { useSetState } from '/@/shared/hooks/use-set-state';
 import { PlayerData, QueueSong } from '/@/shared/types/domain-types';
 
 const imageVariants: Variants = {

src/renderer/features/player/components/full-screen-player.tsx

@@ -1,4 +1,3 @@
-import { useHotkeys } from '@mantine/hooks';
 import { motion, Variants } from 'motion/react';
 import { CSSProperties, useLayoutEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -27,6 +26,7 @@ import { Popover } from '/@/shared/components/popover/popover';
 import { Select } from '/@/shared/components/select/select';
 import { Slider } from '/@/shared/components/slider/slider';
 import { Switch } from '/@/shared/components/switch/switch';
+import { useHotkeys } from '/@/shared/hooks/use-hotkeys';
 import { Platform } from '/@/shared/types/types';
 
 const mainBackground = 'var(--theme-colors-background)';

src/renderer/features/player/components/left-controls.tsx

@@ -1,4 +1,3 @@
-import { useHotkeys } from '@mantine/hooks';
 import clsx from 'clsx';
 import { AnimatePresence, LayoutGroup, motion } from 'motion/react';
 import React, { MouseEvent } from 'react';
@@ -24,6 +23,7 @@ import { Separator } from '/@/shared/components/separator/separator';
 import { Text } from '/@/shared/components/text/text';
 import { Tooltip } from '/@/shared/components/tooltip/tooltip';
 import { PlaybackSelectors } from '/@/shared/constants/playback-selectors';
+import { useHotkeys } from '/@/shared/hooks/use-hotkeys';
 import { LibraryItem } from '/@/shared/types/domain-types';
 
 export const LeftControls = () => {

src/renderer/features/player/components/right-controls.tsx

@@ -1,4 +1,3 @@
-import { useHotkeys, useMediaQuery } from '@mantine/hooks';
 import { useCallback, WheelEvent } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -23,6 +22,8 @@ import { ActionIcon } from '/@/shared/components/action-icon/action-icon';
 import { Flex } from '/@/shared/components/flex/flex';
 import { Group } from '/@/shared/components/group/group';
 import { Rating } from '/@/shared/components/rating/rating';
+import { useHotkeys } from '/@/shared/hooks/use-hotkeys';
+import { useMediaQuery } from '/@/shared/hooks/use-media-query';
 import { LibraryItem, QueueSong, ServerType } from '/@/shared/types/domain-types';
 
 const calculateVolumeUp = (volume: number, volumeWheelStep: number) => {

src/renderer/features/search/components/command-palette.tsx

@@ -1,4 +1,3 @@
-import { useDebouncedValue, useDisclosure } from '@mantine/hooks';
 import { useQuery } from '@tanstack/react-query';
 import { Fragment, useCallback, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -23,6 +22,8 @@ import { Kbd } from '/@/shared/components/kbd/kbd';
 import { Modal } from '/@/shared/components/modal/modal';
 import { Spinner } from '/@/shared/components/spinner/spinner';
 import { TextInput } from '/@/shared/components/text-input/text-input';
+import { useDebouncedValue } from '/@/shared/hooks/use-debounced-value';
+import { useDisclosure } from '/@/shared/hooks/use-disclosure';
 import { LibraryItem } from '/@/shared/types/domain-types';
 
 interface CommandPaletteProps {

src/renderer/features/servers/components/add-server-form.tsx

@@ -1,5 +1,4 @@
 import { useForm } from '@mantine/form';
-import { useFocusTrap } from '@mantine/hooks';
 import { closeAllModals } from '@mantine/modals';
 import isElectron from 'is-electron';
 import { nanoid } from 'nanoid/non-secure';
@@ -21,6 +20,7 @@ import { Stack } from '/@/shared/components/stack/stack';
 import { TextInput } from '/@/shared/components/text-input/text-input';
 import { Text } from '/@/shared/components/text/text';
 import { toast } from '/@/shared/components/toast/toast';
+import { useFocusTrap } from '/@/shared/hooks/use-focus-trap';
 import { AuthenticationResponse, ServerListItemWithCredential } from '/@/shared/types/domain-types';
 import { DiscoveredServerItem, ServerType, toServerType } from '/@/shared/types/types';
 

src/renderer/features/servers/components/edit-server-form.tsx

@@ -1,5 +1,4 @@
 import { useForm } from '@mantine/form';
-import { useFocusTrap } from '@mantine/hooks';
 import { closeAllModals } from '@mantine/modals';
 import isElectron from 'is-electron';
 import { useState } from 'react';
@@ -18,6 +17,7 @@ import { Stack } from '/@/shared/components/stack/stack';
 import { TextInput } from '/@/shared/components/text-input/text-input';
 import { toast } from '/@/shared/components/toast/toast';
 import { Tooltip } from '/@/shared/components/tooltip/tooltip';
+import { useFocusTrap } from '/@/shared/hooks/use-focus-trap';
 import {
     AuthenticationResponse,
     ServerListItem,

src/renderer/features/servers/components/server-list-item.tsx

@@ -1,4 +1,3 @@
-import { useDisclosure } from '@mantine/hooks';
 import isElectron from 'is-electron';
 import { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -12,6 +11,7 @@ import { Group } from '/@/shared/components/group/group';
 import { Icon } from '/@/shared/components/icon/icon';
 import { Stack } from '/@/shared/components/stack/stack';
 import { Table } from '/@/shared/components/table/table';
+import { useDisclosure } from '/@/shared/hooks/use-disclosure';
 import { ServerListItem as ServerItem } from '/@/shared/types/domain-types';
 
 const localSettings = isElectron() ? window.api.localSettings : null;

src/renderer/features/shared/components/grid-config.tsx

@@ -9,9 +9,8 @@ import {
     dropTargetForElements,
 } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { disableNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview';
-import { useDebouncedState } from '@mantine/hooks';
 import clsx from 'clsx';
-import Fuse from 'fuse.js';
+import Fuse, { FuseResultMatch } from 'fuse.js';
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -35,6 +34,7 @@ import { Slider } from '/@/shared/components/slider/slider';
 import { Stack } from '/@/shared/components/stack/stack';
 import { TextInput } from '/@/shared/components/text-input/text-input';
 import { Text } from '/@/shared/components/text/text';
+import { useDebouncedState } from '/@/shared/hooks/use-debounced-state';
 import { dndUtils, DragData, DragOperation, DragTarget } from '/@/shared/types/drag-and-drop';
 import { ItemListKey, ListPaginationType } from '/@/shared/types/types';
 
@@ -239,7 +239,7 @@ export const GridConfig = ({
                 };
             })
             .filter(
-                (option): option is typeof allOptions[0] & { disabled?: boolean } =>
+                (option): option is (typeof allOptions)[0] & { disabled: boolean } =>
                     option !== null,
             );
     }, [list, t, grid, extraOptions, optionsConfig, setList, listKey]);
@@ -433,7 +433,11 @@ const GridRowConfig = ({
     );
 };
 
-const DragHandle = ({ dragHandleRef }: { dragHandleRef: React.RefObject<HTMLButtonElement> }) => {
+const DragHandle = ({
+    dragHandleRef,
+}: {
+    dragHandleRef: React.RefObject<HTMLButtonElement | null>;
+}) => {
     return (
         <ActionIcon
             icon="dragVertical"
@@ -470,11 +474,11 @@ const GridRowItem = memo(
         handleReorder: (idFrom: string, idTo: string, edge: Edge | null) => void;
         item: ItemGridListRowConfig;
         label: string;
-        matches: null | readonly Fuse.FuseResultMatch[];
+        matches: null | readonly FuseResultMatch[];
     }) => {
         const { t } = useTranslation();
         const ref = useRef<HTMLDivElement>(null);
-        const dragHandleRef = useRef<HTMLButtonElement>(null);
+        const dragHandleRef = useRef<HTMLButtonElement | null>(null);
         const [isDragging, setIsDragging] = useState(false);
         const [isDraggedOver, setIsDraggedOver] = useState<Edge | null>(null);
 

src/renderer/features/shared/components/search-input.tsx

@@ -1,4 +1,3 @@
-import { useHotkeys } from '@mantine/hooks';
 import { ChangeEvent, CSSProperties, KeyboardEvent, useRef, useState } from 'react';
 import { shallow } from 'zustand/shallow';
 
@@ -7,6 +6,7 @@ import { ActionIcon, ActionIconProps } from '/@/shared/components/action-icon/ac
 import { Box } from '/@/shared/components/box/box';
 import { Icon } from '/@/shared/components/icon/icon';
 import { TextInput, TextInputProps } from '/@/shared/components/text-input/text-input';
+import { useHotkeys } from '/@/shared/hooks/use-hotkeys';
 
 interface SearchInputProps extends TextInputProps {
     buttonProps?: Partial<ActionIconProps>;

src/renderer/features/shared/components/table-config.tsx

@@ -9,7 +9,6 @@ import {
     dropTargetForElements,
 } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { disableNativeDragPreview } from '@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview';
-import { useDebouncedState } from '@mantine/hooks';
 import clsx from 'clsx';
 import Fuse, { type FuseResultMatch } from 'fuse.js';
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
@@ -35,6 +34,7 @@ import { Stack } from '/@/shared/components/stack/stack';
 import { TextInput } from '/@/shared/components/text-input/text-input';
 import { Text } from '/@/shared/components/text/text';
 import { Tooltip } from '/@/shared/components/tooltip/tooltip';
+import { useDebouncedState } from '/@/shared/hooks/use-debounced-state';
 import { dndUtils, DragData, DragOperation, DragTarget } from '/@/shared/types/drag-and-drop';
 import { ItemListKey, ListPaginationType } from '/@/shared/types/types';
 

src/renderer/features/shared/hooks/use-search-term-filter.ts

@@ -1,7 +1,7 @@
-import { useDebouncedCallback } from '@mantine/hooks';
 import { parseAsString, useQueryState } from 'nuqs';
 
 import { FILTER_KEYS } from '/@/renderer/features/shared/utils';
+import { useDebouncedCallback } from '/@/shared/hooks/use-debounced-callback';
 
 export const useSearchTermFilter = (defaultValue?: string) => {
     const [searchTerm, setSearchTerm] = useQueryState(

src/renderer/hooks/use-container-query.ts

@@ -1,4 +1,4 @@
-import { useElementSize } from '@mantine/hooks';
+import { useElementSize } from '/@/shared/hooks/use-element-size';
 
 interface UseContainerQueryProps {
     '2xl'?: number;

src/renderer/hooks/use-hide-scrollbar.ts

@@ -1,6 +1,7 @@
-import { useTimeout } from '@mantine/hooks';
 import { useEffect, useState } from 'react';
 
+import { useTimeout } from '/@/shared/hooks/use-timeout';
+
 export const useHideScrollbar = (timeout: number) => {
     const [hideScrollbar, setHideScrollbar] = useState(false);
     const { clear, start } = useTimeout(() => setHideScrollbar(true), timeout);

src/renderer/layouts/default-layout.tsx

@@ -1,4 +1,3 @@
-import { HotkeyItem, useHotkeys } from '@mantine/hooks';
 import clsx from 'clsx';
 import isElectron from 'is-electron';
 import { lazy } from 'react';
@@ -19,6 +18,7 @@ import {
     useSettingsStoreActions,
     useWindowSettings,
 } from '/@/renderer/store/settings.store';
+import { HotkeyItem, useHotkeys } from '/@/shared/hooks/use-hotkeys';
 import { Platform, PlayerType } from '/@/shared/types/types';
 
 if (!isElectron()) {

src/renderer/layouts/default-layout/side-drawer-queue.tsx

@@ -1,4 +1,3 @@
-import { useDisclosure, useTimeout } from '@mantine/hooks';
 import { AnimatePresence, motion, Variants } from 'motion/react';
 import { useCallback } from 'react';
 import { useLocation } from 'react-router';
@@ -9,6 +8,8 @@ import { DrawerPlayQueue } from '/@/renderer/features/now-playing/components/dra
 import { AppRoute } from '/@/renderer/router/routes';
 import { useAppStore, useSidebarStore } from '/@/renderer/store';
 import { Icon } from '/@/shared/components/icon/icon';
+import { useDisclosure } from '/@/shared/hooks/use-disclosure';
+import { useTimeout } from '/@/shared/hooks/use-timeout';
 import { Platform } from '/@/shared/types/types';
 
 const queueDrawerVariants: Variants = {

src/shared/components/button/button.tsx

@@ -1,7 +1,6 @@
 import type { ButtonVariant, ButtonProps as MantineButtonProps } from '@mantine/core';
 
 import { ElementProps, Button as MantineButton } from '@mantine/core';
-import { useTimeout } from '@mantine/hooks';
 import clsx from 'clsx';
 import { forwardRef, useCallback, useRef, useState } from 'react';
 
@@ -9,6 +8,7 @@ import styles from './button.module.css';
 
 import { Spinner } from '/@/shared/components/spinner/spinner';
 import { Tooltip, TooltipProps } from '/@/shared/components/tooltip/tooltip';
+import { useTimeout } from '/@/shared/hooks/use-timeout';
 import { createPolymorphicComponent } from '/@/shared/utils/create-polymorphic-component';
 
 export interface ButtonProps

src/shared/components/scroll-area/scroll-area.tsx

@@ -1,5 +1,4 @@
 import { autoScrollForElements } from '@atlaskit/pragmatic-drag-and-drop-auto-scroll/element';
-import { useMergedRef } from '@mantine/hooks';
 import clsx from 'clsx';
 import { useOverlayScrollbars } from 'overlayscrollbars-react';
 import { forwardRef, Ref, useEffect, useRef, useState } from 'react';
@@ -7,6 +6,7 @@ import { forwardRef, Ref, useEffect, useRef, useState } from 'react';
 import styles from './scroll-area.module.css';
 import './scroll-area.css';
 
+import { useMergedRef } from '/@/shared/hooks/use-merged-ref';
 import { DragData, DragTarget } from '/@/shared/types/drag-and-drop';
 
 interface ScrollAreaProps extends React.ComponentPropsWithoutRef<'div'> {

src/shared/hooks/use-debounced-callback.ts

@@ -0,0 +1,3 @@
+import { useDebouncedCallback as useMantineDebouncedCallback } from '@mantine/hooks';
+
+export const useDebouncedCallback = useMantineDebouncedCallback;

src/shared/hooks/use-debounced-state.ts

@@ -0,0 +1,3 @@
+import { useDebouncedState as useMantineDebouncedState } from '@mantine/hooks';
+
+export const useDebouncedState = useMantineDebouncedState;

src/shared/hooks/use-debounced-value.ts

@@ -0,0 +1,3 @@
+import { useDebouncedValue as useDebouncedValueMantine } from '@mantine/hooks';
+
+export const useDebouncedValue = useDebouncedValueMantine;

src/shared/hooks/use-element-size.ts

@@ -0,0 +1,3 @@
+import { useElementSize as useElementSizeMantine } from '@mantine/hooks';
+
+export const useElementSize = useElementSizeMantine;

src/shared/hooks/use-focus-trap.ts

@@ -0,0 +1,3 @@
+import { useFocusTrap as useMantineFocusTrap } from '@mantine/hooks';
+
+export const useFocusTrap = useMantineFocusTrap;

src/shared/hooks/use-hotkeys.ts

@@ -0,0 +1,8 @@
+import {
+    type HotkeyItem as MantineHotkeyItem,
+    useHotkeys as useMantineHotkeys,
+} from '@mantine/hooks';
+
+export const useHotkeys = useMantineHotkeys;
+
+export type HotkeyItem = MantineHotkeyItem;

src/shared/hooks/use-media-query.ts

@@ -0,0 +1,3 @@
+import { useMediaQuery as useMantineMediaQuery } from '@mantine/hooks';
+
+export const useMediaQuery = useMantineMediaQuery;

src/shared/hooks/use-merged-ref.ts

@@ -0,0 +1,3 @@
+import { useMergedRef as useMergedRefMantine } from '@mantine/hooks';
+
+export const useMergedRef = useMergedRefMantine;

src/shared/hooks/use-set-state.ts

@@ -0,0 +1,3 @@
+import { useSetState as useMantineSetState } from '@mantine/hooks';
+
+export const useSetState = useMantineSetState;

src/shared/hooks/use-timeout.ts

@@ -0,0 +1,3 @@
+import { useTimeout as useMantineTimeout } from '@mantine/hooks';
+
+export const useTimeout = useMantineTimeout;