Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit306b624

Browse files
committed
fix(site): simplify bulk task delete confirmation UI
This change addresses feedback on the tasks bulk delete feature:1. Removed the third confirmation stage (resources stage) - the flow now goes directly from consequences to tasks review, then delete2. Added Cancel button to the dialog by removing hideCancel prop - this matches the single task delete confirmation dialog UX3. Moved workspace count display to the final confirm button text so users still see what will be deletedThe simplified flow reduces friction while still providing adequatewarning about the destructive nature of the action.
1 parenta8862be commit306b624

File tree

2 files changed

+7
-67
lines changed

2 files changed

+7
-67
lines changed

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

Lines changed: 1 addition & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ const meta: Meta<typeof BatchDeleteConfirmation> = {
3333
name:"task-docs-789",
3434
display_name:"Update Documentation",
3535
initial_prompt:"Update documentation for the new features",
36-
// Intentionally null to test that only 2 workspaces are shown in review resources stage
36+
// Intentionally null to test that only 2 workspaces are shown
3737
workspace_id:null,
3838
created_at:newDate(
3939
Date.now()-3*24*60*60*1000,
@@ -64,23 +64,3 @@ export const ReviewTasks: Story = {
6464
});
6565
},
6666
};
67-
68-
exportconstReviewResources:Story={
69-
play:async({ canvasElement, step})=>{
70-
constbody=within(canvasElement.ownerDocument.body);
71-
72-
awaitstep("Advance to stage 2: Review tasks",async()=>{
73-
constconfirmButton=awaitbody.findByRole("button",{
74-
name:/reviewselectedtasks/i,
75-
});
76-
awaituserEvent.click(confirmButton);
77-
});
78-
79-
awaitstep("Advance to stage 3: Review resources",async()=>{
80-
constconfirmButton=awaitbody.findByRole("button",{
81-
name:/confirm.*tasks/i,
82-
});
83-
awaituserEvent.click(confirmButton);
84-
});
85-
},
86-
};

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

Lines changed: 6 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import type { Task } from "api/typesGenerated";
22
import{ConfirmDialog}from"components/Dialogs/ConfirmDialog/ConfirmDialog";
33
importdayjsfrom"dayjs";
44
importrelativeTimefrom"dayjs/plugin/relativeTime";
5-
import{ClockIcon,ServerIcon,UserIcon}from"lucide-react";
5+
import{ClockIcon,UserIcon}from"lucide-react";
66
import{typeFC,typeReactNode,useState}from"react";
77

88
dayjs.extend(relativeTime);
@@ -24,17 +24,12 @@ export const BatchDeleteConfirmation: FC<BatchDeleteConfirmationProps> = ({
2424
onConfirm,
2525
isLoading,
2626
})=>{
27-
const[stage,setStage]=useState<"consequences"|"tasks"|"resources">(
28-
"consequences",
29-
);
27+
const[stage,setStage]=useState<"consequences"|"tasks">("consequences");
3028

3129
constonProceed=()=>{
3230
switch(stage){
33-
case"resources":
34-
onConfirm();
35-
break;
3631
case"tasks":
37-
setStage("resources");
32+
onConfirm();
3833
break;
3934
case"consequences":
4035
setStage("tasks");
@@ -45,15 +40,12 @@ export const BatchDeleteConfirmation: FC<BatchDeleteConfirmationProps> = ({
4540
consttaskCount=`${checkedTasks.length}${
4641
checkedTasks.length===1 ?"task" :"tasks"
4742
}`;
43+
constworkspaceCountText=`${workspaceCount}${
44+
workspaceCount===1 ?"workspace" :"workspaces"
45+
}`;
4846

4947
letconfirmText:ReactNode=<>Review selected tasks&hellip;</>;
5048
if(stage==="tasks"){
51-
confirmText=<>Confirm{taskCount}&hellip;</>;
52-
}
53-
if(stage==="resources"){
54-
constworkspaceCountText=`${workspaceCount}${
55-
workspaceCount===1 ?"workspace" :"workspaces"
56-
}`;
5749
confirmText=(
5850
<>
5951
Delete{taskCount} and{workspaceCountText}
@@ -70,19 +62,13 @@ export const BatchDeleteConfirmation: FC<BatchDeleteConfirmationProps> = ({
7062
onClose();
7163
}}
7264
title={`Delete${taskCount}`}
73-
hideCancel
7465
confirmLoading={isLoading}
7566
confirmText={confirmText}
7667
onConfirm={onProceed}
7768
description={
7869
<>
7970
{stage==="consequences"&&<Consequences/>}
8071
{stage==="tasks"&&<Taskstasks={checkedTasks}/>}
81-
{stage==="resources"&&(
82-
<Resourcestasks={checkedTasks}workspaceCount={workspaceCount}/>
83-
)}
84-
{/* Preload ServerIcon to prevent flicker on stage 3 */}
85-
<ServerIconclassName="sr-only"aria-hidden/>
8672
</>
8773
}
8874
/>
@@ -93,11 +79,6 @@ interface TasksStageProps {
9379
tasks:readonlyTask[];
9480
}
9581

96-
interfaceResourcesStageProps{
97-
tasks:readonlyTask[];
98-
workspaceCount:number;
99-
}
100-
10182
constConsequences:FC=()=>{
10283
return(
10384
<>
@@ -174,24 +155,3 @@ const Tasks: FC<TasksStageProps> = ({ tasks }) => {
174155
</>
175156
);
176157
};
177-
178-
constResources:FC<ResourcesStageProps>=({ tasks, workspaceCount})=>{
179-
consttaskCount=tasks.length;
180-
181-
return(
182-
<divclassName="flex flex-col gap-4">
183-
<p>
184-
Deleting{taskCount===1 ?"this task" :"these tasks"} will also
185-
permanently destroy&hellip;
186-
</p>
187-
<divclassName="flex flex-wrap justify-center gap-x-5 gap-y-1.5 text-sm">
188-
<divclassName="flex items-center gap-2">
189-
<ServerIconclassName="size-icon-sm"/>
190-
<span>
191-
{workspaceCount}{workspaceCount===1 ?"workspace" :"workspaces"}
192-
</span>
193-
</div>
194-
</div>
195-
</div>
196-
);
197-
};

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp