tooltip

ethanndickson · ethanndickson · commit 92392519af14 · 2025-07-03T08:29:48.000Z
diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -1805,7 +1805,7 @@ class ApiMethods {
 	getConnectionLogs = async (
 		options: TypesGen.ConnectionLogsRequest,
 	): Promise<TypesGen.ConnectionLogResponse> => {
-		const url = getURLWithSearchParams("/api/v2/connectionlogs", options);
+		const url = getURLWithSearchParams("/api/v2/connectionlog", options);
 		const response = await this.axios.get(url);
 		return response.data;
 	};
diff --git a/site/src/pages/ConnectionLogPage/ConnectionLogFilter.tsx b/site/src/pages/ConnectionLogPage/ConnectionLogFilter.tsx
@@ -16,6 +16,7 @@ import {
 } from "modules/tableFiltering/options";
 import type { FC } from "react";
 import { connectionTypeToFriendlyName } from "utils/connection";
+import { docs } from "utils/docs";
 
 const PRESET_FILTERS = [
 	{
@@ -45,8 +46,7 @@ export const ConnectionLogFilter: FC<ConnectionLogFilterProps> = ({
 
 	return (
 		<Filter
-			// TODO(ethanndickson): Add docs
-			// learnMoreLink={docs("/admin/security/connection-logs#filtering-logs")}
+			learnMoreLink={docs("/admin/security/connection-logs#filtering-logs")}
 			presets={PRESET_FILTERS}
 			isLoading={menus.user.isInitializing}
 			filter={filter}
diff --git a/site/src/pages/ConnectionLogPage/ConnectionLogHelpTooltip.tsx b/site/src/pages/ConnectionLogPage/ConnectionLogHelpTooltip.tsx
@@ -0,0 +1,35 @@
+import {
+	HelpTooltip,
+	HelpTooltipContent,
+	HelpTooltipLink,
+	HelpTooltipLinksGroup,
+	HelpTooltipText,
+	HelpTooltipTitle,
+	HelpTooltipTrigger,
+} from "components/HelpTooltip/HelpTooltip";
+import type { FC } from "react";
+import { docs } from "utils/docs";
+
+const Language = {
+	title: "Why are some events missing?",
+	body: "The connection log is a best-effort log of workspace access. Some events are reported by workspace agents, and receipt of these events by the server is not guaranteed.",
+	docs: "Connection log documentation",
+};
+
+export const ConnectionLogHelpTooltip: FC = () => {
+	return (
+		<HelpTooltip>
+			<HelpTooltipTrigger />
+
+			<HelpTooltipContent>
+				<HelpTooltipTitle>{Language.title}</HelpTooltipTitle>
+				<HelpTooltipText>{Language.body}</HelpTooltipText>
+				<HelpTooltipLinksGroup>
+					<HelpTooltipLink href={docs("/admin/security/connection-logs")}>
+						{Language.docs}
+					</HelpTooltipLink>
+				</HelpTooltipLinksGroup>
+			</HelpTooltipContent>
+		</HelpTooltip>
+	);
+};
diff --git a/site/src/pages/ConnectionLogPage/ConnectionLogPageView.tsx b/site/src/pages/ConnectionLogPage/ConnectionLogPageView.tsx
@@ -21,7 +21,9 @@ import { Stack } from "components/Stack/Stack";
 import { TableLoader } from "components/TableLoader/TableLoader";
 import { Timeline } from "components/Timeline/Timeline";
 import type { ComponentProps, FC } from "react";
+import { docs } from "utils/docs";
 import { ConnectionLogFilter } from "./ConnectionLogFilter";
+import { ConnectionLogHelpTooltip } from "./ConnectionLogHelpTooltip";
 import { ConnectionLogRow } from "./ConnectionLogRow/ConnectionLogRow";
 
 const Language = {
@@ -59,6 +61,7 @@ export const ConnectionLogPageView: FC<ConnectionLogPageViewProps> = ({
 				<PageHeaderTitle>
 					<Stack direction="row" spacing={1} alignItems="center">
 						<span>{Language.title}</span>
+						<ConnectionLogHelpTooltip />
 					</Stack>
 				</PageHeaderTitle>
 				<PageHeaderSubtitle>{Language.subtitle}</PageHeaderSubtitle>
@@ -134,8 +137,7 @@ export const ConnectionLogPageView: FC<ConnectionLogPageViewProps> = ({
 					<Paywall
 						message="Connection logs"
 						description="Connection logs allow you to see how and when users connect to workspaces. You need a Premium license to use this feature."
-						// TODO(ethanndickson): docs
-						// documentationLink={docs("/admin/security/connection-logs")}
+						documentationLink={docs("/admin/security/connection-logs")}
 					/>
 				</Cond>
 			</ChooseOne>
