From 58e0630df827ba990b2c228984e34024b53f61c4 Mon Sep 17 00:00:00 2001
From: McKayla Washburn <mckayla@hey.com>
Date: Tue, 29 Oct 2024 00:30:14 +0000
Subject: [PATCH 1/2] fix: show template name on workspace page when template
 display name is unset

---
 site/src/pages/WorkspacePage/WorkspaceTopbar.tsx | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx b/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx
index e3be26462cc5b..7ca112befb4e5 100644
--- a/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx
+++ b/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx
@@ -160,7 +160,9 @@ export const WorkspaceTopbar: FC<WorkspaceProps> = ({
 						templateIconUrl={workspace.template_icon}
 						rootTemplateUrl={templateLink}
 						templateVersionName={workspace.latest_build.template_version_name}
-						templateVersionDisplayName={workspace.template_display_name}
+						templateDisplayName={
+							workspace.template_display_name || workspace.template_name
+						}
 						latestBuildVersionName={
 							workspace.latest_build.template_version_name
 						}
@@ -366,7 +368,7 @@ type WorkspaceBreadcrumbProps = Readonly<{
 	rootTemplateUrl: string;
 	templateVersionName: string;
 	latestBuildVersionName: string;
-	templateVersionDisplayName?: string;
+	templateDisplayName: string;
 }>;
 
 const WorkspaceBreadcrumb: FC<WorkspaceBreadcrumbProps> = ({
@@ -375,7 +377,7 @@ const WorkspaceBreadcrumb: FC<WorkspaceBreadcrumbProps> = ({
 	rootTemplateUrl,
 	templateVersionName,
 	latestBuildVersionName,
-	templateVersionDisplayName = templateVersionName,
+	templateDisplayName,
 }) => {
 	return (
 		<Popover mode="hover">
@@ -399,7 +401,7 @@ const WorkspaceBreadcrumb: FC<WorkspaceBreadcrumbProps> = ({
 							to={rootTemplateUrl}
 							css={{ color: "inherit" }}
 						>
-							{templateVersionDisplayName}
+							{templateDisplayName}
 						</Link>
 					}
 					subtitle={
@@ -419,7 +421,7 @@ const WorkspaceBreadcrumb: FC<WorkspaceBreadcrumbProps> = ({
 							fitImage
 						/>
 					}
-					imgFallbackText={templateVersionDisplayName}
+					imgFallbackText={templateDisplayName}
 				/>
 			</HelpTooltipContent>
 		</Popover>

From ee48b370050edc18c581d7dcdb8efe12fe716fc9 Mon Sep 17 00:00:00 2001
From: McKayla Washburn <mckayla@hey.com>
Date: Tue, 29 Oct 2024 18:21:58 +0000
Subject: [PATCH 2/2] thanks I hate it

---
 .../WorkspacePage/WorkspaceTopbar.stories.tsx | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx
index ef7c72895552b..d95cfc3d60daf 100644
--- a/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx
+++ b/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx
@@ -320,3 +320,39 @@ export const TemplateDoesNotAllowAutostop: Story = {
 		},
 	},
 };
+
+export const TemplateInfoPopover: Story = {
+	play: async ({ canvasElement, step }) => {
+		const canvas = within(canvasElement);
+
+		await step("activate hover trigger", async () => {
+			await userEvent.hover(canvas.getByText(baseWorkspace.name));
+			await waitFor(() =>
+				expect(
+					canvas.getByRole("presentation", { hidden: true }),
+				).toHaveTextContent(MockTemplate.display_name),
+			);
+		});
+	},
+};
+
+export const TemplateInfoPopoverWithoutDisplayName: Story = {
+	args: {
+		workspace: {
+			...baseWorkspace,
+			template_display_name: "",
+		},
+	},
+	play: async ({ canvasElement, step }) => {
+		const canvas = within(canvasElement);
+
+		await step("activate hover trigger", async () => {
+			await userEvent.hover(canvas.getByText(baseWorkspace.name));
+			await waitFor(() =>
+				expect(
+					canvas.getByRole("presentation", { hidden: true }),
+				).toHaveTextContent(MockTemplate.name),
+			);
+		});
+	},
+};