feat: create link component

jaaydenh · jaaydenh · commit 2ab31a55f710 · 2025-01-17T14:50:35.000Z
diff --git a/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPage.tsx b/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPage.tsx
@@ -11,8 +11,8 @@ import { ChooseOne, Cond } from "components/Conditionals/ChooseOne";
 import { EmptyState } from "components/EmptyState/EmptyState";
 import { displayError } from "components/GlobalSnackbar/utils";
 import { displaySuccess } from "components/GlobalSnackbar/utils";
+import { Link } from "components/Link/Link";
 import { Paywall } from "components/Paywall/Paywall";
-import { SquareArrowOutUpRight } from "lucide-react";
 import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility";
 import { useOrganizationSettings } from "modules/management/OrganizationSettingsLayout";
 import { type FC, useEffect } from "react";
@@ -107,16 +107,9 @@ export const IdpSyncPage: FC = () => {
 						<p className="flex flex-row gap-1 text-sm text-content-secondary font-medium m-0">
 							Automatically assign groups or roles to a user based on their IdP
 							claims.
-							<a
-								href={docs("/admin/users/idp-sync")}
-								className="flex flex-row text-content-link items-center gap-1 no-underline hover:underline visited:text-content-link"
-							>
-								View docs
-								<SquareArrowOutUpRight size={14} />
-							</a>
+							<Link text="View docs" href={docs("/admin/users/idp-sync")} />
 						</p>
 					</div>
-					{/* <ExportPolicyButton syncSettings={orgSyncSettingsData} /> */}
 				</header>
 				<ChooseOne>
 					<Cond condition={!isIdpSyncEnabled}>
diff --git a/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPageView.tsx b/site/src/pages/ManagementSettingsPage/IdpSyncPage/IdpSyncPageView.tsx
@@ -697,12 +697,7 @@ const TableLoader = () => {
 
 const LegacyGroupSyncHeader: FC = () => {
 	return (
-		<h4
-			css={{
-				fontSize: 20,
-				fontWeight: 500,
-			}}
-		>
+		<h4 className="text-xl font-medium">
 			<div className="flex items-end gap-2">
 				<span>Legacy group sync settings</span>
 				<HelpTooltip>
