From 324474848b59c9222f4f41978780664d628123cf Mon Sep 17 00:00:00 2001
From: Kenneth <kennethnym@hey.com>
Date: Thu, 28 Nov 2024 19:32:33 +0000
Subject: [PATCH] fix: new workspace dialog not closed when created

---
 web/src/workspaces/api.ts                   |  1 +
 web/src/workspaces/dashboard.tsx            | 10 ++++++----
 web/src/workspaces/new-workspace-dialog.tsx | 14 +++++++-------
 3 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/web/src/workspaces/api.ts b/web/src/workspaces/api.ts
index 96d5722..78008e6 100644
--- a/web/src/workspaces/api.ts
+++ b/web/src/workspaces/api.ts
@@ -47,6 +47,7 @@ function useCreateWorkspace() {
 						throwOnError: true,
 					},
 				);
+				setStatus({ type: "ok" });
 				return workspace ?? null;
 			} catch (error: unknown) {
 				setStatus({ type: "error", error });
diff --git a/web/src/workspaces/dashboard.tsx b/web/src/workspaces/dashboard.tsx
index 7c48cba..61c989b 100644
--- a/web/src/workspaces/dashboard.tsx
+++ b/web/src/workspaces/dashboard.tsx
@@ -6,7 +6,7 @@ import { Page } from "@/components/ui/page.tsx";
 import { SidebarProvider } from "@/components/ui/sidebar.tsx";
 import { Toaster } from "@/components/ui/toaster";
 import { Plus } from "lucide-react";
-import { useState } from "react";
+import { useCallback, useState } from "react";
 import { WorkspaceTable } from "./workspace-table";
 import { NewWorkspaceDialog } from "./new-workspace-dialog";
 
@@ -31,6 +31,10 @@ function Main() {
 	const [isNewWorkspaceDialogOpen, setIsNewWorkspaceDialogOpen] =
 		useState(false);
 
+	const closeWorkspaceDialog = useCallback(() => {
+		setIsNewWorkspaceDialogOpen(false);
+	}, []);
+
 	return (
 		<Dialog
 			open={isNewWorkspaceDialogOpen}
@@ -47,9 +51,7 @@ function Main() {
 				<WorkspaceTable />
 			</main>
 
-			<NewWorkspaceDialog
-				onCreateSuccess={() => setIsNewWorkspaceDialogOpen(false)}
-			/>
+			<NewWorkspaceDialog onCreateSuccess={closeWorkspaceDialog} />
 		</Dialog>
 	);
 }
diff --git a/web/src/workspaces/new-workspace-dialog.tsx b/web/src/workspaces/new-workspace-dialog.tsx
index 0b61bc5..8f06280 100644
--- a/web/src/workspaces/new-workspace-dialog.tsx
+++ b/web/src/workspaces/new-workspace-dialog.tsx
@@ -29,14 +29,16 @@ import { useForm } from "react-hook-form";
 import { nonempty, object, pattern, string, type Infer } from "superstruct";
 import { useCreateWorkspace } from "./api";
 
+interface NewWorkspaceDialogProps {
+	onCreateSuccess: () => void;
+}
+
 const NewWorkspaceForm = object({
 	workspaceName: pattern(string(), /^[\w-]+$/),
 	imageId: nonempty(string()),
 });
 
-function NewWorkspaceDialog({
-	onCreateSuccess,
-}: { onCreateSuccess: () => void }) {
+function NewWorkspaceDialog({ onCreateSuccess }: NewWorkspaceDialogProps) {
 	const { data: templateImages, isLoading, error } = useTemplateImages();
 	const form = useForm({
 		resolver: superstructResolver(NewWorkspaceForm),
@@ -49,8 +51,6 @@ function NewWorkspaceDialog({
 	const { toast } = useToast();
 	const formRef = useRef<HTMLFormElement | null>(null);
 
-	const _onCreateSuccess = useCallback(onCreateSuccess, []);
-
 	useEffect(() => {
 		switch (status.type) {
 			case "error":
@@ -70,12 +70,12 @@ function NewWorkspaceDialog({
 				});
 				break;
 			case "ok":
-				_onCreateSuccess();
+				onCreateSuccess();
 				break;
 			default:
 				break;
 		}
-	}, [status.type, toast, _onCreateSuccess]);
+	}, [status.type, toast, onCreateSuccess]);
 
 	async function onSubmit(values: Infer<typeof NewWorkspaceForm>) {
 		await createWorkspace({