refactor: migrate deployment banner to Tailwind and radix (coder#20479)

before:
<img width="1667" height="48" alt="Screenshot 2025-10-25 at 18 02 45"
src="https://github.com/user-attachments/assets/1525a01e-5976-4d0e-8280-1b9ae8d91197"
/>

after:
<img width="1662" height="35" alt="Screenshot 2025-10-25 at 18 02 17"
src="https://github.com/user-attachments/assets/d0fd7b69-ee88-4986-a539-5917c17a8b85"
/>

Author: jaaydenh

site/src/components/Link/Link.tsx

@@ -27,10 +27,14 @@ interface LinkProps
 	extends React.AnchorHTMLAttributes<HTMLAnchorElement>,
 		VariantProps<typeof linkVariants> {
 	asChild?: boolean;
+	showExternalIcon?: boolean;
 }
 
 export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
-	({ className, children, size, asChild, ...props }, ref) => {
+	(
+		{ className, children, size, asChild, showExternalIcon = true, ...props },
+		ref,
+	) => {
 		const Comp = asChild ? Slot : "a";
 		return (
 			<Comp
@@ -39,7 +43,7 @@ export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
 				{...props}
 			>
 				<Slottable>{children}</Slottable>
-				<SquareArrowOutUpRightIcon aria-hidden="true" />
+				{showExternalIcon && <SquareArrowOutUpRightIcon aria-hidden="true" />}
 			</Comp>
 		);
 	},

site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.stories.tsx

@@ -3,6 +3,7 @@ import {
 	MockDeploymentStats,
 } from "testHelpers/entities";
 import type { Meta, StoryObj } from "@storybook/react-vite";
+import { expect, screen, userEvent, waitFor, within } from "storybook/test";
 import { DeploymentBannerView } from "./DeploymentBannerView";
 
 const meta: Meta<typeof DeploymentBannerView> = {
@@ -22,6 +23,14 @@ export const WithHealthIssues: Story = {
 	args: {
 		health: DeploymentHealthUnhealthy,
 	},
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		const trigger = canvas.getByTestId("deployment-health-trigger");
+		await userEvent.hover(trigger);
+		await waitFor(() =>
+			expect(screen.getByRole("tooltip")).toBeInTheDocument(),
+		);
+	},
 };
 
 export const WithDismissedHealthIssues: Story = {
@@ -34,4 +43,12 @@ export const WithDismissedHealthIssues: Story = {
 			},
 		},
 	},
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+		const trigger = canvas.getByTestId("deployment-health-trigger");
+		await userEvent.hover(trigger);
+		await waitFor(() =>
+			expect(screen.getByRole("tooltip")).toBeInTheDocument(),
+		);
+	},
 };