chore: hide create workspace button on template header

jaaydenh · jaaydenh · commit ff77fe988688 · 2025-04-02T14:49:21.000Z
diff --git a/site/src/pages/TemplatePage/TemplateLayout.tsx b/site/src/pages/TemplatePage/TemplateLayout.tsx
@@ -1,4 +1,5 @@
 import { API } from "api/api";
+import { organizationsPermissions } from "api/queries/organizations";
 import type { AuthorizationRequest } from "api/typesGenerated";
 import { ErrorAlert } from "components/Alert/ErrorAlert";
 import { Loader } from "components/Loader/Loader";
@@ -77,6 +78,9 @@ export const TemplateLayout: FC<PropsWithChildren> = ({
 		queryKey: ["template", templateName],
 		queryFn: () => fetchTemplate(organizationName, templateName),
 	});
+	const orgPermissionsQuery = useQuery(
+		organizationsPermissions([organizationName]),
+	);
 	const location = useLocation();
 	const paths = location.pathname.split("/");
 	const activeTab = paths.at(-1) === templateName ? "summary" : paths.at(-1)!;
@@ -85,24 +89,27 @@ export const TemplateLayout: FC<PropsWithChildren> = ({
 	const shouldShowInsights =
 		data?.permissions?.canUpdateTemplate || data?.permissions?.canReadInsights;
 
-	if (error) {
+	if (error || orgPermissionsQuery.error) {
 		return (
 			<div css={{ margin: 16 }}>
 				<ErrorAlert error={error} />
 			</div>
 		);
 	}
 
-	if (isLoading || !data) {
+	if (isLoading || !data || !orgPermissionsQuery.data) {
 		return <Loader />;
 	}
 
+	const orgPermissions = orgPermissionsQuery.data?.[organizationName];
+
 	return (
 		<>
 			<TemplatePageHeader
 				template={data.template}
 				activeVersion={data.activeVersion}
 				permissions={data.permissions}
+				orgPermissions={orgPermissions}
 				onDeleteTemplate={() => {
 					navigate("/templates");
 				}}
diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.tsx
@@ -31,6 +31,7 @@ import {
 import { Pill } from "components/Pill/Pill";
 import { Stack } from "components/Stack/Stack";
 import { linkToTemplate, useLinks } from "modules/navigation";
+import type { OrganizationPermissions } from "modules/permissions/organizations";
 import type { FC } from "react";
 import { useQuery } from "react-query";
 import { Link as RouterLink, useNavigate } from "react-router-dom";
@@ -158,13 +159,15 @@ export type TemplatePageHeaderProps = {
 	template: Template;
 	activeVersion: TemplateVersion;
 	permissions: AuthorizationResponse;
+	orgPermissions: OrganizationPermissions;
 	onDeleteTemplate: () => void;
 };
 
 export const TemplatePageHeader: FC<TemplatePageHeaderProps> = ({
 	template,
 	activeVersion,
 	permissions,
+	orgPermissions,
 	onDeleteTemplate,
 }) => {
 	const getLink = useLinks();
@@ -177,7 +180,7 @@ export const TemplatePageHeader: FC<TemplatePageHeaderProps> = ({
 			<PageHeader
 				actions={
 					<>
-						{!template.deprecated && (
+						{!template.deprecated && orgPermissions.createWorkspaces && (
 							<Button
 								variant="contained"
 								startIcon={<AddIcon />}
