coder · Parkreiner · Oct 11, 2023 · Oct 10, 2023 · Oct 10, 2023 · Oct 10, 2023
@@ -6,3 +6,10 @@ export const templateVersionLogs = (versionId: string) => {
     queryFn: () => API.getTemplateVersionLogs(versionId),
   };
 };
+
+export const richParameters = (versionId: string) => {
+  return {
+    queryKey: ["templateVersion", versionId, "richParameters"],
+    queryFn: () => API.getTemplateVersionRichParameters(versionId),
+  };
+};
@@ -1,7 +1,6 @@
 import * as API from "api/api";
 import {
   type Template,
-  type AuthorizationResponse,
   type CreateTemplateVersionRequest,
   type ProvisionerJobStatus,
   type TemplateVersion,
@@ -21,25 +20,10 @@ export const templateByNameKey = (orgId: string, name: string) => [
 export const templateByName = (
   orgId: string,
   name: string,
-): QueryOptions<{ template: Template; permissions: AuthorizationResponse }> => {
+): QueryOptions<Template> => {
   return {
     queryKey: templateByNameKey(orgId, name),
-    queryFn: async () => {
-      const template = await API.getTemplateByName(orgId, name);
-      const permissions = await API.checkAuthorization({
-        checks: {
-          canUpdateTemplate: {
-            object: {
-              resource_type: "template",
-              resource_id: template.id,
-            },
-            action: "update",
-          },
-        },
-      });
-
-      return { template, permissions };
-    },
+    queryFn: async () => API.getTemplateByName(orgId, name),
   };
 };
 

@@ -1,10 +1,89 @@
 import * as API from "api/api";
-import { type QueryOptions } from "react-query";
+import { QueryClient, type QueryOptions } from "react-query";
+
 import {
+  type WorkspaceBuildParameter,
+  type Workspace,
+  type CreateWorkspaceRequest,
   type WorkspacesResponse,
   type WorkspacesRequest,
 } from "api/typesGenerated";
 
+export const workspaceByOwnerAndNameKey = (owner: string, name: string) => [
+  "workspace",
+  owner,
+  name,
+  "settings",
+];
+
+export const workspaceByOwnerAndName = (
+  owner: string,
+  name: string,
+): QueryOptions<Workspace> => {
+  return {
+    queryKey: workspaceByOwnerAndNameKey(owner, name),
+    queryFn: () => API.getWorkspaceByOwnerAndName(owner, name),
+  };
+};
+
+type AutoCreateWorkspaceOptions = {
+  templateName: string;
+  versionId?: string;
+  organizationId: string;
+  defaultBuildParameters?: WorkspaceBuildParameter[];
+  defaultName: string;
+};
+
+type CreateWorkspaceMutationVariables = CreateWorkspaceRequest & {
+  userId: string;
+  organizationId: string;
+};
+
+export const createWorkspace = (queryClient: QueryClient) => {
+  return {
+    mutationFn: async (variables: CreateWorkspaceMutationVariables) => {
+      const { userId, organizationId, ...req } = variables;
+      return API.createWorkspace(organizationId, userId, req);
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries(["workspaces"]);
+    },
+  };
+};
+
+export const autoCreateWorkspace = (queryClient: QueryClient) => {
+  return {
+    mutationFn: async ({
+      templateName,
+      versionId,
+      organizationId,
+      defaultBuildParameters,
+      defaultName,
+    }: AutoCreateWorkspaceOptions) => {
+      let templateVersionParameters;
+
+      if (versionId) {
+        templateVersionParameters = { template_version_id: versionId };
+      } else {
+        const template = await API.getTemplateByName(
+          organizationId,
+          templateName,
+        );
+        templateVersionParameters = { template_id: template.id };
+      }
+
+      return API.createWorkspace(organizationId, "me", {
+        ...templateVersionParameters,
+        name: defaultName,
+        rich_parameter_values: defaultBuildParameters,
+      });
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries(["workspaces"]);
+    },
+  };
+};
+
 export function workspacesKey(config: WorkspacesRequest = {}) {
   const { q, limit } = config;
   return ["workspaces", { q, limit }] as const;

@@ -1,4 +1,4 @@
-import type { FC } from "react";
+import { forwardRef } from "react";
 import type { CSSObject } from "@emotion/react";
 
 export type StackProps = {
@@ -10,7 +10,7 @@ export type StackProps = {
   wrap?: CSSObject["flexWrap"];
 } & React.HTMLProps<HTMLDivElement>;
 
-export const Stack: FC<StackProps> = (props) => {
+export const Stack = forwardRef<HTMLDivElement, StackProps>((props, ref) => {
   const {
     children,
     direction = "column",
@@ -24,6 +24,7 @@ export const Stack: FC<StackProps> = (props) => {
   return (
     <div
       {...divProps}
+      ref={ref}
       css={(theme) => ({
         display: "flex",
         flexDirection: direction,
@@ -37,4 +38,4 @@ export const Stack: FC<StackProps> = (props) => {
       {children}
     </div>
   );
-};
+});
@@ -22,8 +22,7 @@ export const DuplicateTemplateView = () => {
   const templateByNameQuery = useQuery(
     templateByName(organizationId, searchParams.get("fromTemplate")!),
   );
-  const activeVersionId =
-    templateByNameQuery.data?.template.active_version_id ?? "";
+  const activeVersionId = templateByNameQuery.data?.active_version_id ?? "";
   const templateVersionQuery = useQuery({
     ...templateVersion(activeVersionId),
     enabled: templateByNameQuery.isSuccess,
@@ -63,7 +62,7 @@ export const DuplicateTemplateView = () => {
   return (
     <CreateTemplateForm
       {...formPermissions}
-      copiedTemplate={templateByNameQuery.data!.template}
+      copiedTemplate={templateByNameQuery.data!}
       error={createTemplateMutation.error}
       isSubmitting={createTemplateMutation.isLoading}
       variables={templateVersionVariablesQuery.data}