Skip to content

Commit

Permalink
Add explanations, wait for child measuremens before calculating
Browse files Browse the repository at this point in the history
  • Loading branch information
arnautov-anton committed Sep 26, 2023
1 parent 09f43ac commit 684fac0
Showing 1 changed file with 10 additions and 2 deletions.
12 changes: 10 additions & 2 deletions packages/react-sdk/src/core/hooks/useCalculateHardLimit.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,14 @@ export const useCalculateHardLimit = (
)
return;

let childWidth = 280;
let childHeight = 160;
let childWidth: number | null = null;
let childHeight: number | null = null;

const resizeObserver = new ResizeObserver((entries, observer) => {
// this part should ideally run as little times as possible
// get child measurements and disconnect
// does not consider dynamically sized children
// this hook is for SpeakerLayout use only, where children in the bar are fixed size
if (entries.length > 1) {
const child = hostElement.firstChild as HTMLElement | null;

Expand All @@ -42,6 +46,10 @@ export const useCalculateHardLimit = (
}
}

// keep the state at { vertical: 1, horizontal: 1 }
// until we get the proper child measurements
if (childHeight === null || childWidth === null) return;

const vertical = Math.floor(wrapperElement.clientHeight / childHeight);
const horizontal = Math.floor(wrapperElement.clientWidth / childWidth);

Expand Down

0 comments on commit 684fac0

Please sign in to comment.