Skip to content

Commit caf8d0f

Browse files
fix(site): hide empty tasks list when templates are empty
Don't show the empty tasks section when there are no AI-enabled templates. This prevents showing both empty states simultaneously. Also add a Storybook story for the empty templates scenario. Closes coder/internal#1085
1 parent 8ee6e94 commit caf8d0f

2 files changed

Lines changed: 61 additions & 44 deletions

File tree

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

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,21 @@ export const LoadingTemplates: Story = {
5151
},
5252
};
5353

54+
export const EmptyTemplates: Story = {
55+
parameters: {
56+
queries: [
57+
{
58+
key: ["templates", { q: "has-ai-task:true" }],
59+
data: [],
60+
},
61+
{
62+
key: ["tasks", { owner: MockUserOwner.username }],
63+
data: [],
64+
},
65+
],
66+
},
67+
};
68+
5469
export const LoadingTemplatesError: Story = {
5570
beforeEach: () => {
5671
spyOn(API, "getTemplates").mockRejectedValue(

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

Lines changed: 46 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -68,52 +68,54 @@ const TasksPage: FC = () => {
6868
error={aiTemplatesQuery.error}
6969
onRetry={aiTemplatesQuery.refetch}
7070
/>
71-
{aiTemplatesQuery.isSuccess && (
72-
<section className="py-8">
73-
{permissions.viewDeploymentConfig && (
74-
<section
75-
className="mt-6 flex justify-between"
76-
aria-label="Controls"
77-
>
78-
<div className="flex items-center bg-surface-secondary rounded p-1">
79-
<PillButton
80-
active={tab.value === "all"}
81-
onClick={() => tab.setValue("all")}
82-
>
83-
All tasks
84-
</PillButton>
85-
<PillButton
86-
disabled={!idleTasks || idleTasks.length === 0}
87-
active={tab.value === "waiting-for-input"}
88-
onClick={() => tab.setValue("waiting-for-input")}
89-
>
90-
Waiting for input
91-
{idleTasks && idleTasks.length > 0 && (
92-
<Badge className="-mr-0.5" size="xs" variant="info">
93-
{idleTasks.length}
94-
</Badge>
95-
)}
96-
</PillButton>
97-
</div>
71+
{aiTemplatesQuery.isSuccess &&
72+
aiTemplatesQuery.data &&
73+
aiTemplatesQuery.data.length > 0 && (
74+
<section className="py-8">
75+
{permissions.viewDeploymentConfig && (
76+
<section
77+
className="mt-6 flex justify-between"
78+
aria-label="Controls"
79+
>
80+
<div className="flex items-center bg-surface-secondary rounded p-1">
81+
<PillButton
82+
active={tab.value === "all"}
83+
onClick={() => tab.setValue("all")}
84+
>
85+
All tasks
86+
</PillButton>
87+
<PillButton
88+
disabled={!idleTasks || idleTasks.length === 0}
89+
active={tab.value === "waiting-for-input"}
90+
onClick={() => tab.setValue("waiting-for-input")}
91+
>
92+
Waiting for input
93+
{idleTasks && idleTasks.length > 0 && (
94+
<Badge className="-mr-0.5" size="xs" variant="info">
95+
{idleTasks.length}
96+
</Badge>
97+
)}
98+
</PillButton>
99+
</div>
98100

99-
<UsersCombobox
100-
value={ownerFilter.value}
101-
onValueChange={(username) => {
102-
ownerFilter.setValue(
103-
username === ownerFilter.value ? "" : username,
104-
);
105-
}}
106-
/>
107-
</section>
108-
)}
101+
<UsersCombobox
102+
value={ownerFilter.value}
103+
onValueChange={(username) => {
104+
ownerFilter.setValue(
105+
username === ownerFilter.value ? "" : username,
106+
);
107+
}}
108+
/>
109+
</section>
110+
)}
109111

110-
<TasksTable
111-
tasks={displayedTasks}
112-
error={tasksQuery.error}
113-
onRetry={tasksQuery.refetch}
114-
/>
115-
</section>
116-
)}
112+
<TasksTable
113+
tasks={displayedTasks}
114+
error={tasksQuery.error}
115+
onRetry={tasksQuery.refetch}
116+
/>
117+
</section>
118+
)}
117119
</main>
118120
</Margins>
119121
</>

0 commit comments

Comments
 (0)