vojo/src/app/hooks/useResizeObserver.ts
Ajay Bura c07905c360
Improve Members Right Panel (#1286)
* fix room members hook

* fix resize observer hook

* add intersection observer hook

* install react-virtual lib

* improve right panel - WIP

* add filters for members

* fix bug in async search

* categories members and add search

* show spinner on room member fetch

* make invite member btn clickable

* so no member text

* add line between room view and member drawer

* fix imports

* add screen size hook

* fix set setting hook

* make member drawer responsive

* extract power level tags hook

* fix room members hook

* fix use async search api

* produce search result on filter change
2023-06-22 09:14:50 +10:00

25 lines
867 B
TypeScript

import { useEffect, useMemo } from 'react';
export type OnResizeCallback = (entries: ResizeObserverEntry[]) => void;
export const getResizeObserverEntry = (
target: Element,
entries: ResizeObserverEntry[]
): ResizeObserverEntry | undefined => entries.find((entry) => entry.target === target);
export const useResizeObserver = (
onResizeCallback: OnResizeCallback,
observeElement?: Element | null | (() => Element | null)
): ResizeObserver => {
const resizeObserver = useMemo(() => new ResizeObserver(onResizeCallback), [onResizeCallback]);
useEffect(() => {
const element = typeof observeElement === 'function' ? observeElement() : observeElement;
if (element) resizeObserver.observe(element);
return () => {
if (element) resizeObserver.unobserve(element);
};
}, [resizeObserver, observeElement]);
return resizeObserver;
};