Skip to content

fix: Bug fix of #20489 #321

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Parent: fix: Merging dev chnages for v2 version
merged 2 commits into from
Jul 11, 2025
Merged

fix: Bug fix of #20489 #321

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
af9e5b5
Bug fix of #20489
Ravikirana-Microsoft Jul 11, 2025
ee6daf4
build error fix
Ravikirana-Microsoft Jul 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
120 changes: 86 additions & 34 deletions src/frontend/src/components/content/TaskDetails.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
// TaskDetails.tsx - Merged TSX + Styles

import { HumanFeedbackStatus, Step, TaskDetailsProps } from "@/models";
import { HumanFeedbackStatus, Step as OriginalStep, TaskDetailsProps } from "@/models";

// Extend Step to include _isActionLoading
type Step = OriginalStep & { _isActionLoading?: boolean };
import {
Text,
Avatar,
Expand Down Expand Up @@ -28,7 +31,7 @@ const TaskDetails: React.FC<TaskDetailsProps> = ({
loading,
OnApproveStep,
}) => {
const [steps, setSteps] = useState(planData.steps || []);
const [steps, setSteps] = useState<Step[]>(planData.steps || []);
const [completedCount, setCompletedCount] = useState(
planData?.plan.completed || 0
);
Expand Down Expand Up @@ -146,45 +149,94 @@ const TaskDetails: React.FC<TaskDetailsProps> = ({
<Caption1>{functionOrDetails}</Caption1>
)}
</Body1>
<div className="task-details-action-buttons">
<div className="task-details-action-buttons">
{step.human_approval_status !== "accepted" &&
step.human_approval_status !== "rejected" && (
<> <Tooltip relationship="label" content={canInteract?"Approve":"You must first provide feedback to the planner"}>
<Button
icon={<Checkmark20Regular />}
appearance="subtle"
onClick={
canInteract
? () => preOnApproved(step)
: undefined
}
className={
canInteract
? "task-details-action-button"
: "task-details-action-button-disabled"
<>
<Tooltip relationship="label" content={canInteract ? "Approve" : "You must first provide feedback to the planner"}>
<Button
icon={<Checkmark20Regular />}
appearance="subtle"
onClick={
canInteract
? async (e) => {
// Disable buttons for this step
setSteps((prev) =>
prev.map((s) =>
s.id === step.id
? { ...s, _isActionLoading: true }
: s
)
);
try {
await preOnApproved(step);
} finally {
// Remove loading state after API call
setSteps((prev) =>
prev.map((s) =>
s.id === step.id
? { ...s, _isActionLoading: false }
: s
)
);
}
}
/>
: undefined
}
disabled={
!canInteract ||
!!step._isActionLoading
}
className={
canInteract
? "task-details-action-button"
: "task-details-action-button-disabled"
}
/>
</Tooltip>

<Tooltip relationship="label" content={canInteract?"Reject":"You must first provide feedback to the planner"}>
<Button
icon={<Dismiss20Regular />}
appearance="subtle"
onClick={
canInteract
? () => preOnRejected(step)
: undefined
}
className={
canInteract
? "task-details-action-button"
: "task-details-action-button-disabled"
<Tooltip relationship="label" content={canInteract ? "Reject" : "You must first provide feedback to the planner"}>
<Button
icon={<Dismiss20Regular />}
appearance="subtle"
onClick={
canInteract
? async (e) => {
setSteps((prev) =>
prev.map((s) =>
s.id === step.id
? { ...s, _isActionLoading: true }
: s
)
);
try {
await preOnRejected(step);
} finally {
setSteps((prev) =>
prev.map((s) =>
s.id === step.id
? { ...s, _isActionLoading: false }
: s
)
);
}
/>
</Tooltip></>

}
: undefined
}
disabled={
!canInteract ||
!!step._isActionLoading
}
className={
canInteract
? "task-details-action-button"
: "task-details-action-button-disabled"
}
/>
</Tooltip>
</>
)}
</div>
</div>
</div>
</div>
);
Expand Down
Loading