fix: Distro validation teaser automatically disappear with select ser…

…verSideValidation
dash0hq · Nov 8, 2023 · 1946392 · 1946392
1 parent 46f3191
commit 1946392
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 17 deletions.
diff --git a/packages/otelbin/src/components/AppHeader.tsx b/packages/otelbin/src/components/AppHeader.tsx
@@ -6,7 +6,6 @@ import { LogIn } from "lucide-react";
 import { Share } from "~/components/share/Share";
 import { SignedIn, SignedOut, SignInButton, UserButton } from "@clerk/nextjs";
 import { Button } from "~/components/button";
-import InfoBox from "./validation-type/InfoBox";
 import ValidationType from "./validation-type/ValidationType";
 
 export default function AppHeader() {
@@ -21,8 +20,6 @@ export default function AppHeader() {
 				<div className="w-px bg-neutral-350 h-full">&nbsp;</div>
 
 				<ValidationType />
-
-				<InfoBox />
 			</div>
 			<div className="flex gap-x-2">
 				<Share />

diff --git a/packages/otelbin/src/components/validation-type/ValidationType.tsx b/packages/otelbin/src/components/validation-type/ValidationType.tsx
@@ -9,6 +9,7 @@ import ValidationTypeContent from "./ValidationTypeContent";
 import { useDistributions } from "../validation/useDistributions";
 import { useUrlState } from "~/lib/urlState/client/useUrlState";
 import { distroBinding, distroVersionBinding } from "../validation/binding";
+import InfoBox from "./InfoBox";
 
 export interface ICurrentDistro {
 	distro: string;
@@ -28,19 +29,22 @@ export default function ValidationType() {
 			: undefined;
 
 	return (
-		<Popover open={open} onOpenChange={setOpen} modal={true}>
-			<PopoverTrigger asChild>
-				<Button size="xs" variant="cta">
-					Validation:{" "}
-					<strong>{`${currentDistro?.provider ?? "Browser-only"} ${currentDistro ? " – " : ""} ${
-						currentDistro ? currentDistro.version : ""
-					}`}</strong>{" "}
-					<Down />
-				</Button>
-			</PopoverTrigger>
-			<PopoverContent align="start" className="p-0 max-w-[480px] overflow-y-auto max-h-[90vh]">
-				<ValidationTypeContent currentDistro={currentDistro} data={data} setOpen={setOpen} />
-			</PopoverContent>
-		</Popover>
+		<div className="flex items-center gap-x-4">
+			<Popover open={open} onOpenChange={setOpen} modal={true}>
+				<PopoverTrigger asChild>
+					<Button size="xs" variant="cta">
+						Validation:{" "}
+						<strong>{`${currentDistro?.provider ?? "Browser-only"} ${currentDistro ? " – " : ""} ${
+							currentDistro ? currentDistro.version : ""
+						}`}</strong>{" "}
+						<Down />
+					</Button>
+				</PopoverTrigger>
+				<PopoverContent align="start" className="p-0 max-w-[480px] overflow-y-auto max-h-[90vh]">
+					<ValidationTypeContent currentDistro={currentDistro} data={data} setOpen={setOpen} />
+				</PopoverContent>
+			</Popover>
+			{distro === null && distroVersion === null && <InfoBox />}
+		</div>
 	);
 }