Try fixing jank extensionBanner flow

This commit is contained in:
Cooper Ransom 2024-04-06 12:44:21 -04:00
parent 366251e143
commit 6e478fd37e
2 changed files with 5 additions and 3 deletions

View File

@ -29,11 +29,11 @@ export function Layout(props: { children: ReactNode }) {
return (
<div>
{extensionState !== "success" && !isMobile && (
{extensionState !== "success" ? (
<div className="fixed inset-x-0 z-[1000]">
<ExtensionBanner extensionState={extensionState} />
</div>
)}
) : null}
<div
style={{
paddingTop: location === null ? `${bannerSize}px` : "0px",

View File

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