human-readable task workspace name, ensure task title doesn't overflow

hugodutka · hugodutka · commit e41c498b3777 · 2025-06-10T19:00:38.000Z
diff --git a/site/src/pages/TaskPage/TaskPage.tsx b/site/src/pages/TaskPage/TaskPage.tsx
@@ -15,6 +15,7 @@ import { Link as RouterLink } from "react-router-dom";
 import { pageTitle } from "utils/page";
 import { TaskApps } from "./TaskApps";
 import { TaskSidebar } from "./TaskSidebar";
+import { ellipsizeText } from "utils/ellipsizeText";
 
 const TaskPage = () => {
 	const { workspace: workspaceName, username } = useParams() as {
@@ -163,7 +164,7 @@ const TaskPage = () => {
 	return (
 		<>
 			<Helmet>
-				<title>{pageTitle(task.prompt)}</title>
+				<title>{pageTitle(ellipsizeText(task.prompt, 64)!)}</title>
 			</Helmet>
 
 			<div className="h-full flex justify-stretch">
diff --git a/site/src/pages/TaskPage/TaskSidebar.tsx b/site/src/pages/TaskPage/TaskSidebar.tsx
@@ -97,7 +97,7 @@ export const TaskSidebar: FC<TaskSidebarProps> = ({ task }) => {
 					</DropdownMenu>
 				</div>
 
-				<h1 className="m-0 mt-1 text-base font-medium">{task.prompt}</h1>
+				<h1 className="m-0 mt-1 text-base font-medium truncate">{task.prompt}</h1>
 
 				{task.workspace.latest_app_status?.uri && (
 					<div className="flex items-center gap-2 mt-2 flex-wrap">
diff --git a/site/src/pages/TasksPage/TasksPage.tsx b/site/src/pages/TasksPage/TasksPage.tsx
@@ -40,6 +40,7 @@ import TextareaAutosize from "react-textarea-autosize";
 import { pageTitle } from "utils/page";
 import { relativeTime } from "utils/time";
 import { type UserOption, UsersCombobox } from "./UsersCombobox";
+import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName";
 
 type TasksFilter = {
 	user: UserOption | undefined;
@@ -488,8 +489,9 @@ export const data = {
 		userId: string,
 		templateId: string,
 	): Promise<Task> {
+
 		const workspace = await API.createWorkspace(userId, {
-			name: `task-${new Date().getTime()}`,
+			name: `task-${generateWorkspaceName()}`,
 			template_id: templateId,
 			rich_parameter_values: [
 				{ name: AI_PROMPT_PARAMETER_NAME, value: prompt },
