dev
/
sudo-archive
mirror of https://github.com/sussy-code/smov.git
2
1
Fork 0
Code Issues Packages Projects Releases Wiki Activity

implement isMobile into extension banner

This commit is contained in:
Cooper Ransom 2024-03-26 13:31:49 -04:00
parent cfd43c789d
commit 1ba72fe768
1 changed files with 2 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/setup/Layout.tsx
View File

@ -2,6 +2,7 @@ import { ReactNode, useEffect, useState } from "react";
import { isAllowedExtensionVersion } from "@/backend/extension/compatibility";
import { extensionInfo } from "@/backend/extension/messaging";
import { useIsMobile } from "@/hooks/useIsMobile";
import { useBannerSize, useBannerStore } from "@/stores/banner";
import { ExtensionBanner } from "@/stores/banner/BannerLocation";
@ -28,7 +29,7 @@ export function Layout(props: { children: ReactNode }) {
const location = useBannerStore((s) => s.location);
const [extensionState, setExtensionState] =
useState<ExtensionStatus>("unknown");
const [isMobile, setIsMobile] = useState(false);
const { isMobile } = useIsMobile();
useEffect(() => {
let isMounted = true;
@ -39,19 +40,8 @@ export function Layout(props: { children: ReactNode }) {
}
});
// Instead use isMobile like this `const { isMobile } = useIsMobile();`
const mediaQuery = window.matchMedia("(max-width: 768px)"); // Adjust the max-width as per your needs
setIsMobile(mediaQuery.matches);
const handleResize = () => {
setIsMobile(mediaQuery.matches);
};
mediaQuery.addListener(handleResize);
return () => {
isMounted = false;
mediaQuery.removeListener(handleResize);
};
}, []);