Skip to content

Commit 83966e3

Browse files
fix(site): hide empty tasks list when templates are empty (#20845)
When there are no task templates, only the empty templates prompt is displayed, and the tasks section (including controls and table) is hidden.
1 parent 3fe29ec commit 83966e3

File tree

2 files changed

+61
-44
lines changed

2 files changed

+61
-44
lines changed

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

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

56+
export const EmptyTemplates: Story = {
57+
parameters: {
58+
queries: [
59+
{
60+
key: ["templates", { q: "has-ai-task:true" }],
61+
data: [],
62+
},
63+
{
64+
key: ["tasks", { owner: MockUserOwner.username }],
65+
data: [],
66+
},
67+
],
68+
},
69+
};
70+
5671
export const LoadingTemplatesError: Story = {
5772
beforeEach: () => {
5873
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)