1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-20 14:37:43 +01:00

Fix janky code

This commit is contained in:
Cooper Ransom 2024-04-06 13:09:31 -04:00
parent 6e478fd37e
commit 5af78196d1
2 changed files with 8 additions and 9 deletions

View file

@ -1,6 +1,5 @@
import { ReactNode, useEffect, useState } from "react"; import { ReactNode, useEffect, useState } from "react";
import { useIsMobile } from "@/hooks/useIsMobile";
import { useBannerSize, useBannerStore } from "@/stores/banner"; import { useBannerSize, useBannerStore } from "@/stores/banner";
import { ExtensionBanner } from "@/stores/banner/BannerLocation"; import { ExtensionBanner } from "@/stores/banner/BannerLocation";
import { getExtensionState } from "@/utils/extension"; import { getExtensionState } from "@/utils/extension";
@ -11,7 +10,7 @@ export function Layout(props: { children: ReactNode }) {
const location = useBannerStore((s) => s.location); const location = useBannerStore((s) => s.location);
const [extensionState, setExtensionState] = const [extensionState, setExtensionState] =
useState<ExtensionStatus>("unknown"); useState<ExtensionStatus>("unknown");
const { isMobile } = useIsMobile(); const [storeLoaded, setStoreLoaded] = useState(false);
useEffect(() => { useEffect(() => {
let isMounted = true; let isMounted = true;
@ -19,6 +18,7 @@ export function Layout(props: { children: ReactNode }) {
getExtensionState().then((state) => { getExtensionState().then((state) => {
if (isMounted) { if (isMounted) {
setExtensionState(state); setExtensionState(state);
setStoreLoaded(true);
} }
}); });
@ -29,7 +29,7 @@ export function Layout(props: { children: ReactNode }) {
return ( return (
<div> <div>
{extensionState !== "success" ? ( {storeLoaded && extensionState !== "success" ? (
<div className="fixed inset-x-0 z-[1000]"> <div className="fixed inset-x-0 z-[1000]">
<ExtensionBanner extensionState={extensionState} /> <ExtensionBanner extensionState={extensionState} />
</div> </div>

View file

@ -3,7 +3,6 @@ import { Trans, useTranslation } from "react-i18next";
import { useLocation, useNavigate } from "react-router-dom"; import { useLocation, useNavigate } from "react-router-dom";
import { Icon, Icons } from "@/components/Icon"; import { Icon, Icons } from "@/components/Icon";
import { useIsMobile } from "@/hooks/useIsMobile";
import { useBannerStore, useRegisterBanner } from "@/stores/banner"; import { useBannerStore, useRegisterBanner } from "@/stores/banner";
import type { ExtensionStatus } from "@/utils/extension"; import type { ExtensionStatus } from "@/utils/extension";
@ -66,11 +65,11 @@ export function ExtensionBanner(props: {
const currentLocation = useBannerStore((s) => s.location); const currentLocation = useBannerStore((s) => s.location);
const loc = props.location ?? null; const loc = props.location ?? null;
const { pathname } = useLocation(); const { pathname } = useLocation();
const isEligible = const isEligible = !(
/CrOS/.test(navigator.userAgent) || /CrOS/.test(navigator.userAgent) ||
/TV/.test(navigator.userAgent) || /TV/.test(navigator.userAgent) ||
/iPhone|iPad|iPod/i.test(navigator.userAgent); /iPhone|iPad|iPod/i.test(navigator.userAgent)
const { isMobile } = useIsMobile(); );
useEffect(() => { useEffect(() => {
if (loc) { if (loc) {
@ -89,8 +88,8 @@ export function ExtensionBanner(props: {
if (currentLocation !== loc || pathname === "/onboarding/extension") if (currentLocation !== loc || pathname === "/onboarding/extension")
return null; return null;
// Show the banner with a 36.5% chance or not if users dont meet requirements // Show the banner with a 36.5% chance or not if users don't meet requirements
if (!isEligible && !isMobile && Math.random() < 0.365) { if (isEligible && Math.random() < 0.365) {
let bannerText = ""; let bannerText = "";
switch (props.extensionState) { switch (props.extensionState) {
case "noperms": case "noperms":