Skip to content

Commit 576fe31

Browse files
ssncferreirassncferreira
committed
feat(site): use display name field for tasks
1 parent 37fc664 commit 576fe31

File tree

5 files changed

+85
-11
lines changed

5 files changed

+85
-11
lines changed

‎site/src/modules/tasks/TasksSidebar/TasksSidebar.stories.tsx‎

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
import { MockTasks, MockUserOwner, mockApiError } from "testHelpers/entities";
1+
import {
2+
MockDisplayNameTasks,
3+
MockTasks,
4+
MockUserOwner,
5+
mockApiError,
6+
} from "testHelpers/entities";
27
import { withAuthProvider } from "testHelpers/storybook";
38
import type { Meta, StoryObj } from "@storybook/react-vite";
49
import { API } from "api/api";
@@ -64,6 +69,17 @@ export const Loaded: Story = {
6469
},
6570
};
6671

72+
export const DisplayName: Story = {
73+
parameters: {
74+
queries: [
75+
{
76+
key: ["tasks", { owner: MockUserOwner.username }],
77+
data: MockDisplayNameTasks,
78+
},
79+
],
80+
},
81+
};
82+
6783
export const Empty: Story = {
6884
beforeEach: () => {
6985
spyOn(API.experimental, "getTasks").mockResolvedValue([]);

‎site/src/modules/tasks/TasksSidebar/TasksSidebar.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -203,7 +203,9 @@ const TaskSidebarMenuItem: FC<TaskSidebarMenuItemProps> = ({ task }) => {
203203
}}
204204
>
205205
<TaskSidebarMenuItemStatus task={task} />
206-
<span className="truncate">{task.name}</span>
206+
<span className="block max-w-[220px] truncate">
207+
{task.display_name}
208+
</span>
207209
<DropdownMenu>
208210
<DropdownMenuTrigger asChild>
209211
<Button

‎site/src/pages/TasksPage/TasksPage.stories.tsx‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import {
2+
MockDisplayNameTasks,
23
MockInitializingTasks,
34
MockTasks,
45
MockTemplate,
@@ -122,6 +123,21 @@ export const LoadedTasks: Story = {
122123
},
123124
};
124125

126+
export const DisplayName: Story = {
127+
parameters: {
128+
queries: [
129+
{
130+
key: ["tasks", { owner: MockUserOwner.username }],
131+
data: MockDisplayNameTasks,
132+
},
133+
{
134+
key: getTemplatesQueryKey({ q: "has-ai-task:true" }),
135+
data: [MockTemplate],
136+
},
137+
],
138+
},
139+
};
140+
125141
export const LoadedTasksWaitingForInputTab: Story = {
126142
beforeEach: () => {
127143
const [firstTask, ...otherTasks] = MockTasks;

‎site/src/pages/TasksPage/TasksTable.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -135,8 +135,8 @@ const TaskRow: FC<TaskRowProps> = ({ task }) => {
135135
<TableCell>
136136
<AvatarData
137137
title={
138-
<span className="block max-w-[520px] overflow-hidden text-ellipsis whitespace-nowrap">
139-
{task.initial_prompt}
138+
<span className="block max-w-[520px] truncate">
139+
{task.display_name}
140140
</span>
141141
}
142142
subtitle={templateDisplayName}

‎site/src/testHelpers/entities.ts‎

Lines changed: 47 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4996,8 +4996,9 @@ export const MockAIPromptPresets: TypesGen.Preset[] = [
49964996

49974997
export const MockTask = {
49984998
id: "test-task",
4999-
name: "task-wild-test-123",
5000-
display_name: "Task wild test 123",
4999+
name: "react-system-metrics-123",
5000+
display_name:
5001+
"Build a React dashboard component for monitoring system metrics",
50015002
organization_id: MockOrganization.id,
50025003
owner_id: MockUserOwner.id,
50035004
owner_name: MockUserOwner.username,
@@ -5038,6 +5039,7 @@ export const MockTasks = [
50385039
...MockTask,
50395040
id: "task-2",
50405041
name: "fix-avatar-size",
5042+
display_name: "Fix avatar size",
50415043
current_state: {
50425044
...MockTask.current_state,
50435045
message: "Avatar size fixed!",
@@ -5048,6 +5050,7 @@ export const MockTasks = [
50485050
...MockTask,
50495051
id: "task-3",
50505052
name: "fix-accessibility-issues",
5053+
display_name: "Fix accessibility issues",
50515054
current_state: {
50525055
...MockTask.current_state,
50535056
message: "Accessibility issues fixed!",
@@ -5060,7 +5063,8 @@ export const MockInitializingTasks = [
50605063
{
50615064
...MockTask,
50625065
id: "task-1",
5063-
name: "task-workspace-pending",
5066+
name: "workspace-pending",
5067+
display_name: "Workspace pending",
50645068
initial_prompt: "Task Workspace Pending",
50655069
status: "initializing",
50665070
current_state: {
@@ -5073,7 +5077,8 @@ export const MockInitializingTasks = [
50735077
{
50745078
...MockTask,
50755079
id: "task-2",
5076-
name: "task-workspace-starting",
5080+
name: "workspace-starting",
5081+
display_name: "Workspace starting",
50775082
initial_prompt: "Task Workspace Starting",
50785083
status: "initializing",
50795084
current_state: {
@@ -5086,7 +5091,8 @@ export const MockInitializingTasks = [
50865091
{
50875092
...MockTask,
50885093
id: "task-3",
5089-
name: "task-agent-connecting",
5094+
name: "agent-connecting",
5095+
display_name: "Agent connecting",
50905096
initial_prompt: "Task Agent Connecting",
50915097
status: "initializing",
50925098
current_state: {
@@ -5099,7 +5105,8 @@ export const MockInitializingTasks = [
50995105
{
51005106
...MockTask,
51015107
id: "task-4",
5102-
name: "task-agent-starting",
5108+
name: "agent-starting",
5109+
display_name: "Agent Starting",
51035110
initial_prompt: "Task Agent Starting",
51045111
status: "initializing",
51055112
current_state: {
@@ -5112,7 +5119,8 @@ export const MockInitializingTasks = [
51125119
{
51135120
...MockTask,
51145121
id: "task-5",
5115-
name: "task-app-initializing",
5122+
name: "app-initializing",
5123+
display_name: "App Initializing",
51165124
initial_prompt: "Task App Initializing",
51175125
status: "initializing",
51185126
current_state: {
@@ -5124,6 +5132,38 @@ export const MockInitializingTasks = [
51245132
},
51255133
] satisfies TypesGen.Task[];
51265134

5135+
export const MockDisplayNameTasks = [
5136+
{
5137+
...MockTask,
5138+
},
5139+
{
5140+
...MockTask,
5141+
id: "task-4",
5142+
name: "validate-email-regex",
5143+
// Display name with 64 characters with ellipsis
5144+
display_name:
5145+
"Write a function to validate email addresses using regular expr…",
5146+
current_state: {
5147+
...MockTask.current_state,
5148+
message: "Email validation complete!",
5149+
state: "complete",
5150+
},
5151+
},
5152+
{
5153+
...MockTask,
5154+
id: "payment-api-tests",
5155+
name: "payment-api-tests",
5156+
// Display name with 81 characters
5157+
display_name:
5158+
"Create a comprehensive test suite for the new payment processing microservice API",
5159+
current_state: {
5160+
...MockTask.current_state,
5161+
message: "Test suite created!",
5162+
state: "complete",
5163+
},
5164+
},
5165+
] satisfies TypesGen.Task[];
5166+
51275167
export const MockInterception: TypesGen.AIBridgeInterception = {
51285168
id: "5c1da48a-9eb0-440e-9c82-5bc5692a603d",
51295169
initiator: {

0 commit comments

Comments
 (0)