Mirrors/Stirling-PDF
Mirrors/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Frooodle/Stirling-PDF.git synced 2025-08-02 13:48:15 +02:00
Code Issues Packages Projects Releases Wiki Activity

rename useIsOverflow hook and add comments to explain usage

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/shared/QuickAccessBar.tsx
View File

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

4
frontend/src/hooks/useIsOverflow.ts → frontend/src/hooks/useIsOverflowing.ts
View File

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