fix: include origin in support link (#16572)

mtojek · web-flow · commit 1c5a0425c525 · 2025-02-14T13:07:59.000Z
Fixes: #15542
diff --git a/site/src/modules/dashboard/Navbar/MobileMenu.test.tsx b/site/src/modules/dashboard/Navbar/MobileMenu.test.tsx
@@ -0,0 +1,22 @@
+import { includeOrigin } from "./MobileMenu";
+
+const mockOrigin = "https://example.com";
+
+describe("support link", () => {
+	it("should include origin if target starts with '/'", () => {
+		(window as unknown as { location: Partial<Location> }).location = {
+			origin: mockOrigin,
+		}; // Mock the location origin
+
+		expect(includeOrigin("/test")).toBe(`${mockOrigin}/test`);
+		expect(includeOrigin("/path/to/resource")).toBe(
+			`${mockOrigin}/path/to/resource`,
+		);
+	});
+
+	it("should return the target unchanged if it does not start with '/'", () => {
+		expect(includeOrigin(`${mockOrigin}/page`)).toBe(`${mockOrigin}/page`);
+		expect(includeOrigin("../relative/path")).toBe("../relative/path");
+		expect(includeOrigin("relative/path")).toBe("relative/path");
+	});
+});
diff --git a/site/src/modules/dashboard/Navbar/MobileMenu.tsx b/site/src/modules/dashboard/Navbar/MobileMenu.tsx
@@ -307,7 +307,11 @@ const UserSettingsSub: FC<UserSettingsSubProps> = ({
 								asChild
 								className={cn(itemStyles.default, itemStyles.sub)}
 							>
-								<a href={l.target} target="_blank" rel="noreferrer">
+								<a
+									href={includeOrigin(l.target)}
+									target="_blank"
+									rel="noreferrer"
+								>
 									{l.name}
 								</a>
 							</DropdownMenuItem>
@@ -318,3 +322,11 @@ const UserSettingsSub: FC<UserSettingsSubProps> = ({
 		</Collapsible>
 	);
 };
+
+export const includeOrigin = (target: string): string => {
+	if (target.startsWith("/")) {
+		const baseUrl = window.location.origin;
+		return `${baseUrl}${target}`;
+	}
+	return target;
+};
diff --git a/site/src/testHelpers/entities.ts b/site/src/testHelpers/entities.ts
@@ -246,6 +246,11 @@ export const MockSupportLinks: TypesGen.LinkConfig[] = [
 			"https://github.com/coder/coder/issues/new?labels=needs+grooming&body={CODER_BUILD_INFO}",
 		icon: "",
 	},
+	{
+		name: "Fourth link",
+		target: "/icons",
+		icon: "",
+	},
 ];
 
 export const MockUpdateCheck: TypesGen.UpdateCheckResponse = {
