mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-05-29 19:35:20 +02:00
feat: enhance FloatingToolbar to conditionally render based on mobile device detection
This commit is contained in:
parent
e910001518
commit
664961076c
1 changed files with 3 additions and 1 deletions
|
|
@ -18,6 +18,7 @@ import {
|
||||||
} from 'platejs/react';
|
} from 'platejs/react';
|
||||||
|
|
||||||
import { cn } from '@/lib/utils';
|
import { cn } from '@/lib/utils';
|
||||||
|
import { useIsMobile } from '@/hooks/use-mobile';
|
||||||
|
|
||||||
import { Toolbar } from './toolbar';
|
import { Toolbar } from './toolbar';
|
||||||
|
|
||||||
|
|
@ -32,6 +33,7 @@ export function FloatingToolbar({
|
||||||
const editorId = useEditorId();
|
const editorId = useEditorId();
|
||||||
const focusedEditorId = useEventEditorValue('focus');
|
const focusedEditorId = useEventEditorValue('focus');
|
||||||
const isFloatingLinkOpen = !!usePluginOption({ key: KEYS.link }, 'mode');
|
const isFloatingLinkOpen = !!usePluginOption({ key: KEYS.link }, 'mode');
|
||||||
|
const isMobile = useIsMobile();
|
||||||
|
|
||||||
const floatingToolbarState = useFloatingToolbarState({
|
const floatingToolbarState = useFloatingToolbarState({
|
||||||
editorId,
|
editorId,
|
||||||
|
|
@ -65,7 +67,7 @@ export function FloatingToolbar({
|
||||||
|
|
||||||
const ref = useComposedRef<HTMLDivElement>(props.ref, floatingRef);
|
const ref = useComposedRef<HTMLDivElement>(props.ref, floatingRef);
|
||||||
|
|
||||||
if (hidden) return null;
|
if (hidden || isMobile) return null;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div ref={clickOutsideRef}>
|
<div ref={clickOutsideRef}>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue