From ff4fc2f25d7e88890bf7a1e28e49be6013a44cf2 Mon Sep 17 00:00:00 2001
From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com>
Date: Mon, 21 Jul 2025 15:16:11 +0000
Subject: [PATCH 1/5] feat: add View Source button for template administrators
 in workspace creation

Adds a View Source button to the workspace creation page that allows template
administrators to quickly navigate to the template editor. The button:

- Only appears for users with template update permissions
- Links directly to the template version editor
- Uses the ExternalLinkIcon for consistency with other source viewing features
- Is positioned next to the Cancel button in the page header

This addresses user friction where template admins expect to be able to edit
templates directly from the workspace creation flow.

Co-authored-by: matifali <10648092+matifali@users.noreply.github.com>
---
 .../CreateWorkspacePage.tsx                   | 12 ++++++++++-
 .../CreateWorkspacePageView.tsx               | 20 ++++++++++++++++---
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
index 243bd3cb9be2d..c10bd4d39e09f 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
@@ -65,7 +65,16 @@ const CreateWorkspacePage: FC = () => {
 	});
 	const permissionsQuery = useQuery({
 		...checkAuthorization({
-			checks: createWorkspaceChecks(templateQuery.data?.organization_id ?? ""),
+			checks: {
+				...createWorkspaceChecks(templateQuery.data?.organization_id ?? ""),
+				canUpdateTemplate: {
+					object: {
+						resource_type: "template",
+						resource_id: templateQuery.data?.id ?? "",
+					},
+					action: "update",
+				},
+			},
 		}),
 		enabled: !!templateQuery.data,
 	});
@@ -208,6 +217,7 @@ const CreateWorkspacePage: FC = () => {
 					startPollingExternalAuth={startPollingExternalAuth}
 					hasAllRequiredExternalAuth={hasAllRequiredExternalAuth}
 					permissions={permissionsQuery.data as CreateWorkspacePermissions}
+					canUpdateTemplate={permissionsQuery.data?.canUpdateTemplate}
 					parameters={realizedParameters as TemplateVersionParameter[]}
 					presets={templateVersionPresetsQuery.data ?? []}
 					creatingWorkspace={createWorkspaceMutation.isPending}
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
index 75c382f807b1b..8b4326c5f145f 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -28,7 +28,9 @@ import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete";
 import { type FormikContextType, useFormik } from "formik";
 import type { ExternalAuthPollingState } from "hooks/useExternalAuth";
 import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName";
+import { ExternalLinkIcon } from "lucide-react";
 import { type FC, useCallback, useEffect, useMemo, useState } from "react";
+import { Link } from "react-router-dom";
 import {
 	getFormHelpers,
 	nameValidator,
@@ -67,6 +69,7 @@ interface CreateWorkspacePageViewProps {
 	presets: TypesGen.Preset[];
 	permissions: CreateWorkspacePermissions;
 	creatingWorkspace: boolean;
+	canUpdateTemplate?: boolean;
 	onCancel: () => void;
 	onSubmit: (
 		req: TypesGen.CreateWorkspaceRequest,
@@ -92,6 +95,7 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 	presets = [],
 	permissions,
 	creatingWorkspace,
+	canUpdateTemplate,
 	onSubmit,
 	onCancel,
 }) => {
@@ -218,9 +222,19 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 		<Margins size="medium">
 			<PageHeader
 				actions={
-					<Button size="sm" variant="outline" onClick={onCancel}>
-						Cancel
-					</Button>
+					<Stack direction="row" spacing={2}>
+						{canUpdateTemplate && (
+							<Button asChild size="sm" variant="outline">
+								<Link to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}>
+									<ExternalLinkIcon />
+									View source
+								</Link>
+							</Button>
+						)}
+						<Button size="sm" variant="outline" onClick={onCancel}>
+							Cancel
+						</Button>
+					</Stack>
 				}
 			>
 				<Stack direction="row">

From 91e19e89c7965c2ad97e89ee919f43f2f31df6d8 Mon Sep 17 00:00:00 2001
From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com>
Date: Mon, 21 Jul 2025 15:18:38 +0000
Subject: [PATCH 2/5] fix: format Link component to match linting requirements

Co-authored-by: matifali <10648092+matifali@users.noreply.github.com>
---
 .../src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
index 8b4326c5f145f..de2e4d929da9e 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -225,7 +225,9 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 					<Stack direction="row" spacing={2}>
 						{canUpdateTemplate && (
 							<Button asChild size="sm" variant="outline">
-								<Link to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}>
+								<Link
+									to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}
+								>
 									<ExternalLinkIcon />
 									View source
 								</Link>

From a1bb34d59f5002c86fc9f3dd800b7173fa2b8936 Mon Sep 17 00:00:00 2001
From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com>
Date: Mon, 21 Jul 2025 15:21:55 +0000
Subject: [PATCH 3/5] fix: sort imports to match linting requirements

Co-authored-by: matifali <10648092+matifali@users.noreply.github.com>
---
 site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
index de2e4d929da9e..ceac49988c0a5 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -27,8 +27,8 @@ import { Switch } from "components/Switch/Switch";
 import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete";
 import { type FormikContextType, useFormik } from "formik";
 import type { ExternalAuthPollingState } from "hooks/useExternalAuth";
-import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName";
 import { ExternalLinkIcon } from "lucide-react";
+import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName";
 import { type FC, useCallback, useEffect, useMemo, useState } from "react";
 import { Link } from "react-router-dom";
 import {

From 106c38376426205e76b6fa8e0e249cdd0a543098 Mon Sep 17 00:00:00 2001
From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com>
Date: Mon, 21 Jul 2025 21:45:32 +0000
Subject: [PATCH 4/5] feat: add Storybook stories for View Source button

Adds two new stories to test the View Source button functionality:
- WithViewSourceButton: Shows the button for template administrators
- WithoutViewSourceButton: Hides the button for regular users

These stories exercise the canUpdateTemplate prop and demonstrate
the conditional rendering of the View Source button.

Co-authored-by: matifali <10648092+matifali@users.noreply.github.com>
---
 .../CreateWorkspacePageView.stories.tsx       | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
index f085c74c57073..372189464aa8a 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
@@ -382,3 +382,43 @@ export const ExternalAuthAllConnected: Story = {
 		],
 	},
 };
+
+export const WithViewSourceButton: Story = {
+	args: {
+		canUpdateTemplate: true,
+		versionId: "template-version-123",
+		template: {
+			...MockTemplate,
+			organization_name: "default",
+			name: "docker-template",
+		},
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"This story shows the View Source button that appears for template administrators. The button allows quick navigation to the template editor from the workspace creation page.",
+			},
+		},
+	},
+};
+
+export const WithoutViewSourceButton: Story = {
+	args: {
+		canUpdateTemplate: false,
+		versionId: "template-version-123",
+		template: {
+			...MockTemplate,
+			organization_name: "default",
+			name: "docker-template",
+		},
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"This story shows the workspace creation page for users without template update permissions. The View Source button is hidden for these users.",
+			},
+		},
+	},
+};

From aca021171eb52eb429e0b201eebf1afc95e61458 Mon Sep 17 00:00:00 2001
From: "blink-so[bot]" <211532188+blink-so[bot]@users.noreply.github.com>
Date: Wed, 23 Jul 2025 16:32:34 +0000
Subject: [PATCH 5/5] feat: add View Source button to experimental component
 and refactor permissions

Addresses review feedback:
- Added View Source button to CreateWorkspacePageViewExperimental component
- Refactored createWorkspaceChecks helper to include template update permission
- Updated both regular and experimental pages to use the new permissions helper
- Added story for experimental component with View Source button
- Removed unnecessary WithoutViewSourceButton story (default behavior)

The View Source button now appears in both the regular and experimental
workspace creation pages for template administrators.

Co-authored-by: matifali <10648092+matifali@users.noreply.github.com>
---
 .../CreateWorkspacePage.tsx                   | 14 ++++---------
 .../CreateWorkspacePageExperimental.tsx       |  6 +++++-
 .../CreateWorkspacePageView.stories.tsx       | 21 +------------------
 ...eWorkspacePageViewExperimental.stories.tsx | 21 +++++++++++++++++++
 .../CreateWorkspacePageViewExperimental.tsx   | 15 ++++++++++++-
 .../pages/CreateWorkspacePage/permissions.ts  | 18 +++++++++++++---
 6 files changed, 60 insertions(+), 35 deletions(-)

diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
index c10bd4d39e09f..6d057a73d1a50 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx
@@ -65,16 +65,10 @@ const CreateWorkspacePage: FC = () => {
 	});
 	const permissionsQuery = useQuery({
 		...checkAuthorization({
-			checks: {
-				...createWorkspaceChecks(templateQuery.data?.organization_id ?? ""),
-				canUpdateTemplate: {
-					object: {
-						resource_type: "template",
-						resource_id: templateQuery.data?.id ?? "",
-					},
-					action: "update",
-				},
-			},
+			checks: createWorkspaceChecks(
+				templateQuery.data?.organization_id ?? "",
+				templateQuery.data?.id,
+			),
 		}),
 		enabled: !!templateQuery.data,
 	});
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageExperimental.tsx
index 2e39c5625a6cb..b69ef084a77f7 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageExperimental.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageExperimental.tsx
@@ -79,7 +79,10 @@ const CreateWorkspacePageExperimental: FC = () => {
 	});
 	const permissionsQuery = useQuery({
 		...checkAuthorization({
-			checks: createWorkspaceChecks(templateQuery.data?.organization_id ?? ""),
+			checks: createWorkspaceChecks(
+				templateQuery.data?.organization_id ?? "",
+				templateQuery.data?.id,
+			),
 		}),
 		enabled: !!templateQuery.data,
 	});
@@ -292,6 +295,7 @@ const CreateWorkspacePageExperimental: FC = () => {
 					owner={owner}
 					setOwner={setOwner}
 					autofillParameters={autofillParameters}
+					canUpdateTemplate={permissionsQuery.data?.canUpdateTemplate}
 					error={
 						wsError ||
 						createWorkspaceMutation.error ||
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
index 372189464aa8a..d061b604f6b42 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
@@ -28,6 +28,7 @@ const meta: Meta<typeof CreateWorkspacePageView> = {
 		mode: "form",
 		permissions: {
 			createWorkspaceForAny: true,
+			canUpdateTemplate: false,
 		},
 		onCancel: action("onCancel"),
 	},
@@ -402,23 +403,3 @@ export const WithViewSourceButton: Story = {
 		},
 	},
 };
-
-export const WithoutViewSourceButton: Story = {
-	args: {
-		canUpdateTemplate: false,
-		versionId: "template-version-123",
-		template: {
-			...MockTemplate,
-			organization_name: "default",
-			name: "docker-template",
-		},
-	},
-	parameters: {
-		docs: {
-			description: {
-				story:
-					"This story shows the workspace creation page for users without template update permissions. The View Source button is hidden for these users.",
-			},
-		},
-	},
-};
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.stories.tsx
index e00b04fd6bf50..0fcf5d7fbb854 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.stories.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.stories.tsx
@@ -20,6 +20,7 @@ const meta: Meta<typeof CreateWorkspacePageViewExperimental> = {
 		parameters: [],
 		permissions: {
 			createWorkspaceForAny: true,
+			canUpdateTemplate: false,
 		},
 		presets: [],
 		sendMessage: () => {},
@@ -38,3 +39,23 @@ export const WebsocketError: Story = {
 		),
 	},
 };
+
+export const WithViewSourceButton: Story = {
+	args: {
+		canUpdateTemplate: true,
+		versionId: "template-version-123",
+		template: {
+			...MockTemplate,
+			organization_name: "default",
+			name: "docker-template",
+		},
+	},
+	parameters: {
+		docs: {
+			description: {
+				story:
+					"This story shows the View Source button that appears for template administrators in the experimental workspace creation page. The button allows quick navigation to the template editor.",
+			},
+		},
+	},
+};
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx
index 8cb6c4acb6e49..49c4f8a4d5465 100644
--- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx
+++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx
@@ -27,7 +27,7 @@ import {
 import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete";
 import { type FormikContextType, useFormik } from "formik";
 import type { ExternalAuthPollingState } from "hooks/useExternalAuth";
-import { ArrowLeft, CircleHelp } from "lucide-react";
+import { ArrowLeft, CircleHelp, ExternalLinkIcon } from "lucide-react";
 import { useSyncFormParameters } from "modules/hooks/useSyncFormParameters";
 import {
 	Diagnostics,
@@ -44,6 +44,7 @@ import {
 	useRef,
 	useState,
 } from "react";
+import { Link as RouterLink } from "react-router-dom";
 import { docs } from "utils/docs";
 import { nameValidator } from "utils/formUtils";
 import type { AutofillBuildParameter } from "utils/richParameters";
@@ -54,6 +55,7 @@ import type { CreateWorkspacePermissions } from "./permissions";
 
 interface CreateWorkspacePageViewExperimentalProps {
 	autofillParameters: AutofillBuildParameter[];
+	canUpdateTemplate?: boolean;
 	creatingWorkspace: boolean;
 	defaultName?: string | null;
 	defaultOwner: TypesGen.User;
@@ -85,6 +87,7 @@ export const CreateWorkspacePageViewExperimental: FC<
 	CreateWorkspacePageViewExperimentalProps
 > = ({
 	autofillParameters,
+	canUpdateTemplate,
 	creatingWorkspace,
 	defaultName,
 	defaultOwner,
@@ -379,6 +382,16 @@ export const CreateWorkspacePageViewExperimental: FC<
 								</Badge>
 							)}
 						</span>
+						{canUpdateTemplate && (
+							<Button asChild size="sm" variant="outline">
+								<RouterLink
+									to={`/templates/${template.organization_name}/${template.name}/versions/${versionId}/edit`}
+								>
+									<ExternalLinkIcon />
+									View source
+								</RouterLink>
+							</Button>
+						)}
 					</div>
 					<span className="flex flex-row items-center gap-2">
 						<h1 className="text-3xl font-semibold m-0">New workspace</h1>
diff --git a/site/src/pages/CreateWorkspacePage/permissions.ts b/site/src/pages/CreateWorkspacePage/permissions.ts
index 1d933432a6e7c..a5ca3a469f623 100644
--- a/site/src/pages/CreateWorkspacePage/permissions.ts
+++ b/site/src/pages/CreateWorkspacePage/permissions.ts
@@ -1,13 +1,25 @@
-export const createWorkspaceChecks = (organizationId: string) =>
+export const createWorkspaceChecks = (
+	organizationId: string,
+	templateId?: string,
+) =>
 	({
 		createWorkspaceForAny: {
 			object: {
-				resource_type: "workspace",
+				resource_type: "workspace" as const,
 				organization_id: organizationId,
 				owner_id: "*",
 			},
-			action: "create",
+			action: "create" as const,
 		},
+		...(templateId && {
+			canUpdateTemplate: {
+				object: {
+					resource_type: "template" as const,
+					resource_id: templateId,
+				},
+				action: "update" as const,
+			},
+		}),
 	}) as const;
 
 export type CreateWorkspacePermissions = Record<

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>pFad - Phonifier reborn</title>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
</head>
<body>
<h1>Pfad - The Proxy pFad of &#169; 2024 Garber Painting. All rights reserved.</h1>


<!-- Disclaimer -->
<p>Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.</p>
<br>
<p>Alternative Proxies:</p><p><a href="http://clevelandohioweatherforecast.com/php-proxy/index.php?q=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/18951.patch" target="_blank">Alternative Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/18951.patch" target="_blank">pFad Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/v3index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/18951.patch" target="_blank">pFad v3 Proxy</a></p><p><a href="http://clevelandohioweatherforecast.com/pFad/v4index.php?u=https://patch-diff.githubusercontent.com/raw/coder/coder/pull/18951.patch" target="_blank">pFad v4 Proxy</a></p></body>
</html>