Siklos/svg-layout-designer-react
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Merged PR 165: Move useEffects to named functions

Browse source 
Move useEffects to named functions
This commit is contained in:
Eric Nguyen 2022-08-22 15:52:40 +00:00
parent 29625dce28
commit ec3fddec9d
6 changed files with 150 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/Components/SVG/SVG.tsx
View file

@ -33,12 +33,9 @@ function resizeViewBox(
});
}
export const SVG: React.FC<ISVGProps> = (props: ISVGProps) => {
const [viewer, setViewer] = React.useState<Viewer>({
viewerWidth: window.innerWidth - BAR_WIDTH,
viewerHeight: window.innerHeight
});
function useSVGAutoResizer(
setViewer: React.Dispatch<React.SetStateAction<Viewer>>
): void {
React.useEffect(() => {
const onResize = (): void => resizeViewBox(setViewer);
window.addEventListener('resize', onResize);
@ -47,6 +44,15 @@ export const SVG: React.FC<ISVGProps> = (props: ISVGProps) => {
window.removeEventListener('resize', onResize);
};
});
}
export const SVG: React.FC<ISVGProps> = (props: ISVGProps) => {
const [viewer, setViewer] = React.useState<Viewer>({
viewerWidth: window.innerWidth - BAR_WIDTH,
viewerHeight: window.innerHeight
});
useSVGAutoResizer(setViewer);
const xmlns = '<http://www.w3.org/2000/svg>';
const properties = {