diff --git a/site/src/pages/TaskPage/TaskPage.tsx b/site/src/pages/TaskPage/TaskPage.tsx index 4a65c6f1be..57f6c81cff 100644 --- a/site/src/pages/TaskPage/TaskPage.tsx +++ b/site/src/pages/TaskPage/TaskPage.tsx @@ -151,7 +151,7 @@ const TaskPage = () => { return ( <> - {pageTitle(ellipsizeText(task.prompt, 64))} + {pageTitle(task.workspace.name)}
@@ -265,7 +265,3 @@ export const data = { } satisfies Task; }, }; - -const ellipsizeText = (text: string, maxLength = 80): string => { - return text.length <= maxLength ? text : `${text.slice(0, maxLength - 3)}...`; -}; diff --git a/site/src/pages/TaskPage/TaskTopbar.tsx b/site/src/pages/TaskPage/TaskTopbar.tsx index e7bc9283a1..4f51812b47 100644 --- a/site/src/pages/TaskPage/TaskTopbar.tsx +++ b/site/src/pages/TaskPage/TaskTopbar.tsx @@ -5,7 +5,14 @@ import { TooltipProvider, TooltipTrigger, } from "components/Tooltip/Tooltip"; -import { ArrowLeftIcon } from "lucide-react"; +import { useClipboard } from "hooks"; +import { + ArrowLeftIcon, + CheckIcon, + CopyIcon, + LaptopMinimalIcon, + TerminalIcon, +} from "lucide-react"; import type { Task } from "modules/tasks/tasks"; import type { FC } from "react"; import { Link as RouterLink } from "react-router"; @@ -15,7 +22,7 @@ type TaskTopbarProps = { task: Task }; export const TaskTopbar: FC = ({ task }) => { return ( -
+
@@ -30,7 +37,9 @@ export const TaskTopbar: FC = ({ task }) => { -

{task.prompt}

+

+ {task.workspace.name} +

{task.workspace.latest_app_status?.uri && (
@@ -38,13 +47,61 @@ export const TaskTopbar: FC = ({ task }) => {
)} - +
+ + + + + + +

+ {task.prompt} +

+ +
+
+
+ + +
); }; + +type CopyPromptButtonProps = { prompt: string }; + +const CopyPromptButton: FC = ({ prompt }) => { + const { copyToClipboard, showCopiedSuccess } = useClipboard({ + textToCopy: prompt, + }); + + return ( + + ); +};