ff0ecb5e33
* improvement(layerui.js): add lock icon on top right to show encrypted info about excalidraw fixes https://github.com/excalidraw/excalidraw/issues/1313 * swap lock with shield * fix dimensions * make link open in new tab * add newline between toolip text and link * increase tooltip line-height * remove unused GitHubCorner compo * reposition; reintroduce GH icon * make shield into link * make tooltip not show when drawing * Review fix * remove link from tooltip Co-authored-by: dwelle <luzar.david@gmail.com>
32 lines
971 B
TypeScript
32 lines
971 B
TypeScript
import React, { useState, useEffect, useRef, useContext } from "react";
|
|
|
|
const context = React.createContext(false);
|
|
|
|
export function IsMobileProvider({ children }: { children: React.ReactNode }) {
|
|
const query = useRef<MediaQueryList>();
|
|
if (!query.current) {
|
|
query.current = window.matchMedia
|
|
? window.matchMedia(
|
|
"(max-width: 640px), (max-height: 500px) and (max-width: 1000px)",
|
|
)
|
|
: (({
|
|
matches: false,
|
|
addListener: () => {},
|
|
removeListener: () => {},
|
|
} as any) as MediaQueryList);
|
|
}
|
|
const [isMobile, setMobile] = useState(query.current.matches);
|
|
|
|
useEffect(() => {
|
|
const handler = () => setMobile(query.current!.matches);
|
|
query.current!.addListener(handler);
|
|
return () => query.current!.removeListener(handler);
|
|
}, []);
|
|
|
|
return <context.Provider value={isMobile}>{children}</context.Provider>;
|
|
}
|
|
|
|
export default function useIsMobile() {
|
|
return useContext(context);
|
|
}
|