8000 feat: redirect to the task page after creation (#18626) · coder/coder@29ef3a8 · GitHub
[go: up one dir, main page]

Skip to content

Commit 29ef3a8

Browse files
feat: redi 8000 rect to the task page after creation (#18626)
Close #18184
1 parent 1c87796 commit 29ef3a8

File tree

2 files changed

+40
-24
lines changed

2 files changed

+40
-24
lines changed

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

Lines changed: 26 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import type { Meta, StoryObj } from "@storybook/react";
22
import { expect, spyOn, userEvent, waitFor, within } from "@storybook/test";
33
import { API } from "api/api";
44
import { MockUsers } from "pages/UsersPage/storybookData/users";
5+
import { reactRouterParameters } from "storybook-addon-remix-react-router";
56
import {
67
MockTemplate,
78
MockTemplateVersionExternalAuthGithub,
@@ -132,6 +133,23 @@ const newTaskData = {
132133

133134
export const CreateTaskSuccessfully: Story = {
134135
decorators: [withProxyProvider()],
136+
parameters: {
137+
reactRouter: reactRouterParameters({
138+
location: {
139+
path: "/tasks",
140+
},
141+
routing: [
142+
{
143+
path: "/tasks",
144+
useStoryElement: true,
145+
},
146 8000 +
{
147+
path: "/tasks/:ownerName/:workspaceName",
148+
element: <h1>Task page</h1>,
149+
},
150+
],
151+
}),
152+
},
135153
beforeEach: () => {
136154
spyOn(data, "fetchAITemplates").mockResolvedValue([MockTemplate]);
137155
spyOn(data, "fetchTasks")
@@ -150,10 +168,8 @@ export const CreateTaskSuccessfully: Story = {
150168
await userEvent.click(submitButton);
151169
});
152170

153-
await step("Verify task in the table", async () => {
154-
await canvas.findByRole("row", {
155-
name: new RegExp(newTaskData.prompt, "i"),
156-
});
171+
await step("Redirects to the task page", async () => {
172+
await canvas.findByText(/task page/i);
157173
});
158174
},
159< 8000 code>175
};
@@ -187,7 +203,7 @@ export const CreateTaskError: Story = {
187203
},
188204
};
189205

190-
export const WithExternalAuth: Story = {
206+
export const WithAuthenticatedExternalAuth: Story = {
191207
decorators: [withProxyProvider()],
192208
beforeEach: () => {
193209
spyOn(data, "fetchTasks")
@@ -201,26 +217,17 @@ export const WithExternalAuth: Story = {
201217
play: async ({ canvasElement, step }) => {
202218
const canvas = within(canvasElement);
203219

204-
await step("Run task", async () => {
205-
const prompt = await canvas.findByLabelText(/prompt/i);
206-
await userEvent.type(prompt, newTaskData.prompt);
207-
const submitButton = canvas.getByRole("button", { name: /run task/i });
208-
await waitFor(() => expect(submitButton).toBeEnabled());
209-
await userEvent.click(submitButton);
210-
});
211-
212-
await step("Verify task in the table", async () => {
213-
await canvas.findByRole("row", {
214-
name: new RegExp(newTaskData.prompt, "i"),
215-
});
216-
});
217-
218220
await step("Does not render external auth", async () => {
219221
expect(
220222
canvas.queryByText(/external authentication/),
221223
).not.toBeInTheDocument();
222224
});
223225
},
226+
parameters: {
227+
chromatic: {
228+
disableSnapshot: true,
229+
},
230+
},
224231
};
225232

226233
export const MissingExternalAuth: Story = {

site/src/pages/TasksPage/TasksPage.tsx

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName"
5252
import { type FC, type ReactNode, useState } from "react";
5353
import { Helmet } from "react-helmet-async";
5454
import { useMutation, useQuery, useQueryClient } from "react-query";
55-
import { Link as RouterLink } from "react-router-dom";
55+
import { Link as RouterLink, useNavigate } from "react-router-dom";
5656
import TextareaAutosize from "react-textarea-autosize";
5757
import { pageTitle } from "utils/page";
5858
import { relativeTime } from "utils/time";
@@ -163,6 +163,7 @@ const TaskFormSection: FC<{
163163
filter: TasksFilter;
164164
onFilterChange: (filter: TasksFilter) => void;
165165
}> = ({ showFilter, filter, onFilterChange }) => {
166+
const navigate = useNavigate();
166167
const {
167168
data: templates,
168169
error,
@@ -190,7 +191,14 @@ const TaskFormSection: FC<{
190191
}
191192
return (
192193
<>
193-
<TaskForm templates={templates} />
194+
<TaskForm
195+
templates={templates}
196+
onSuccess={(task) => {
197+
navigate(
198+
`/tasks/${task.workspace.owner_name}/${task.workspace.name}`,
199+
);
200+
}}
201+
/>
194202
{showFilter && (
195203
<TasksFilter filter={filter} onFilterChange={onFilterChange} />
196204
)}
@@ -202,9 +210,10 @@ type CreateTaskMutationFnProps = { prompt: string; templateId: string };
202210

203211
type TaskFormProps = {
204212
templates: Template[];
213+
onSuccess: (task: Task) => void;
205214
};
206215

207-
const TaskForm: FC<TaskFormProps> = ({ templates }) => {
216+
const TaskForm: FC<TaskFormProps> = ({ templates, onSuccess }) => {
208217
const { user } = useAuthenticated();
209218
const queryClient = useQueryClient();
210219
const [selectedTemplateId, setSelectedTemplateId] = useState<string>(
@@ -229,10 +238,11 @@ const TaskForm: FC<TaskFormProps> = ({ templates }) => {
229238
const createTaskMutation = useMutation({
230239
mutationFn: async ({ prompt, templateId }: CreateTaskMutationFnProps) =>
231240
data.createTask(prompt, user.id, templateId),
232-
onSuccess: async () => {
241+
onSuccess: async (task) => {
233242
await queryClient.invalidateQueries({
234243
queryKey: ["tasks"],
235244
});
245+
onSuccess(task);
236246
},
237247
});
238248

@@ -249,7 +259,6 @@ const TaskForm: FC<TaskFormProps> = ({ templates }) => {
249259
prompt,
250260
templateId: templateID,
251261
});
252-
form.reset();
253262
} catch (error) {
254263
const message = getErrorMessage(error, "Error creating task");
255264
const detail = getErrorDetail(error) ?? "Please try again";

0 commit comments

Comments
 (0)
0