Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/FoxxMD/multi-scrobbler. Scrobble plays from multiple sources to multiple clients docs.multi-scrobbler.app
deezer docker jellyfin koito lastfm listenbrainz maloja mopidy mpris music music-assistant plex scrobble self-hosted spotify subsonic tautulli youtube-music
Something went wrong. Try again.
1.2 kB · 39 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839import React, { useLayoutEffect } from "react"import useResizeObserver from '@react-hook/resize-observer';
const getTop = item => Math.round(item.getBoundingClientRect().top);
const getIsWrapped = (target: Element) => { if(target === undefined || target === null || target.children === undefined || target.children === null) { return false; } const flexItems = target.children; // flexBox.children;
// target must have 'flex-direction: row' // for this to work
const firstItemTop = getTop(flexItems[0]); //const lastItemTop = getTop(flexItems[flexItems.length - 1]);
for (const flexItem of flexItems) { const isItemWrapped = firstItemTop < getTop(flexItem); if (isItemWrapped) { //setAlign('left'); return true; } } return false;}
export const useIsWrapped = (target: React.RefObject<Element>) => { const [isWrapped, setIsWrapped] = React.useState<boolean>(false);
useLayoutEffect(() => {
const newIsWrapped = getIsWrapped(target.current); setIsWrapped(newIsWrapped); }, [target, setIsWrapped]);
useResizeObserver(target, (entry) => setIsWrapped(getIsWrapped(entry.target))) return isWrapped;}