rename useIsOverflow hook and add comments to explain usage

This commit is contained in:
EthanHealy01 2025-07-24 21:23:45 +01:00
parent 8d96d0d31a
commit 7403dee98d
2 changed files with 4 additions and 4 deletions

View File

@ -10,7 +10,7 @@ import NotificationsIcon from "@mui/icons-material/NotificationsRounded";
import { useRainbowThemeContext } from "./RainbowThemeProvider";
import rainbowStyles from '../../styles/rainbow.module.css';
import AppConfigModal from './AppConfigModal';
import { useIsOverflow } from '../../hooks/useIsOverflow';
import { useIsOverflowing } from '../../hooks/useIsOverflowing';
import './QuickAccessBar.css';
interface QuickAccessBarProps {
@ -114,7 +114,7 @@ const QuickAccessBar = ({
const [configModalOpen, setConfigModalOpen] = useState(false);
const [activeButton, setActiveButton] = useState<string>('tools');
const scrollableRef = useRef<HTMLDivElement>(null);
const isOverflow = useIsOverflow(scrollableRef);
const isOverflow = useIsOverflowing(scrollableRef);
const buttonConfigs: ButtonConfig[] = [
{

View File

@ -20,7 +20,7 @@ import * as React from 'react';
}, [isOverflow]);
const scrollableRef = useRef<HTMLDivElement>(null);
const isOverflow = useIsOverflow(scrollableRef);
const isOverflow = useIsOverflowing(scrollableRef);
Fallback example (for browsers without ResizeObserver):
@ -32,7 +32,7 @@ import * as React from 'react';
*/
export const useIsOverflow = (ref: React.RefObject<HTMLElement | null>, callback?: (isOverflow: boolean) => void) => {
export const useIsOverflowing = (ref: React.RefObject<HTMLElement | null>, callback?: (isOverflow: boolean) => void) => {
// State to track overflow status
const [isOverflow, setIsOverflow] = React.useState<boolean | undefined>(undefined);