From 3699ff6b488891bee7283ffca08f277c91c6bc1b Mon Sep 17 00:00:00 2001
From: Jaayden Halko <jaayden.halko@gmail.com>
Date: Wed, 15 Oct 2025 12:16:18 +0100
Subject: [PATCH] refactor: migrate TermsOfServiceLink from MUI to shadcn/ui
 (#20260)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Migrate the `TermsOfServiceLink` component from MUI to shadcn/ui

## Changes

- **Replaced** `@mui/material/Link` with the custom `Link` component
from `components/Link/Link` (shadcn/ui)
- **Migrated** Emotion `css` prop to Tailwind utility classes
- **Preserved** external link icon functionality (automatically provided
by shadcn Link component)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

---------

Co-authored-by: Claude <noreply@anthropic.com>
---
 site/src/pages/LoginPage/LoginPageView.tsx      |  5 +----
 site/src/pages/LoginPage/TermsOfServiceLink.tsx | 16 +++++-----------
 2 files changed, 6 insertions(+), 15 deletions(-)

diff --git a/site/src/pages/LoginPage/LoginPageView.tsx b/site/src/pages/LoginPage/LoginPageView.tsx
index c6714218ab..7f87a8d9fa 100644
--- a/site/src/pages/LoginPage/LoginPageView.tsx
+++ b/site/src/pages/LoginPage/LoginPageView.tsx
@@ -68,10 +68,7 @@ export const LoginPageView: FC<LoginPageViewProps> = ({
 					</div>
 					<div>{buildInfo?.version}</div>
 					{tosAccepted && (
-						<TermsOfServiceLink
-							url={authMethods?.terms_of_service_url}
-							css={{ fontSize: 12 }}
-						/>
+						<TermsOfServiceLink url={authMethods?.terms_of_service_url} />
 					)}
 				</footer>
 			</div>
diff --git a/site/src/pages/LoginPage/TermsOfServiceLink.tsx b/site/src/pages/LoginPage/TermsOfServiceLink.tsx
index a3ed055c18..c4cfbb2310 100644
--- a/site/src/pages/LoginPage/TermsOfServiceLink.tsx
+++ b/site/src/pages/LoginPage/TermsOfServiceLink.tsx
@@ -1,27 +1,21 @@
-import Link from "@mui/material/Link";
-import { SquareArrowOutUpRightIcon } from "lucide-react";
+import { Link } from "components/Link/Link";
 import type { FC } from "react";
 
 interface TermsOfServiceLinkProps {
-	className?: string;
 	url?: string;
 }
 
-export const TermsOfServiceLink: FC<TermsOfServiceLinkProps> = ({
-	className,
-	url,
-}) => {
+export const TermsOfServiceLink: FC<TermsOfServiceLinkProps> = ({ url }) => {
 	return (
-		<div css={{ paddingTop: 12, fontSize: 16 }} className={className}>
+		<div className="pt-3 text-base">
 			By continuing, you agree to the{" "}
 			<Link
-				css={{ fontWeight: 500, textWrap: "nowrap" }}
+				className="font-medium whitespace-nowrap"
 				href={url}
 				target="_blank"
 				rel="noreferrer"
 			>
-				Terms of Service&nbsp;
-				<SquareArrowOutUpRightIcon className="size-icon-xs" />
+				Terms of Service
 			</Link>
 		</div>
 	);