refactor(frontend): critical simplification and cleanup of HITL components

Remove unnecessary comments and simplify code across HITL components:
- PendingReviewsList: Remove verbose comments, simplify logic flow
- FloatingReviewsPanel: Remove excessive commenting
- PendingReviewCard: Clean up type guard comments
- usePendingReviews: Remove redundant JSDoc comments

This improves code readability while maintaining all functionality.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

Author: majdyz

autogpt_platform/frontend/src/components/organisms/FloatingReviewsPanel/FloatingReviewsPanel.tsx

@@ -25,14 +25,12 @@ export function FloatingReviewsPanel({
     executionId || "",
   );
 
-  // Refetch pending reviews when execution status changes to REVIEW
   useEffect(() => {
     if (executionStatus === AgentExecutionStatus.REVIEW && executionId) {
       refetch();
     }
   }, [executionStatus, executionId, refetch]);
 
-  // Don't show anything if there's no execution ID, no pending reviews, or execution status is not REVIEW
   if (
     !executionId ||
     (!isLoading && pendingReviews.length === 0) ||
@@ -43,13 +41,11 @@ export function FloatingReviewsPanel({
 
   function handleReviewComplete() {
     refetch();
-    // Close panel and let render logic handle visibility
     setIsOpen(false);
   }
 
   return (
     <div className={cn("fixed bottom-20 right-4 z-50", className)}>
-      {/* Trigger Button */}
       {!isOpen && pendingReviews.length > 0 && (
         <Button
           onClick={() => setIsOpen(true)}
@@ -62,10 +58,8 @@ export function FloatingReviewsPanel({
         </Button>
       )}
 
-      {/* Reviews Panel */}
       {isOpen && (
         <div className="flex max-h-[80vh] max-w-2xl flex-col overflow-hidden rounded-lg border bg-white shadow-2xl">
-          {/* Header */}
           <div className="flex items-center justify-between border-b bg-gray-50 p-4">
             <div className="flex items-center gap-2">
               <ClockIcon size={20} className="text-orange-600" />
@@ -76,7 +70,6 @@ export function FloatingReviewsPanel({
             </Button>
           </div>
 
-          {/* Content */}
           <div className="flex-1 overflow-y-auto p-4">
             {isLoading ? (
               <div className="py-8 text-center">

autogpt_platform/frontend/src/components/organisms/PendingReviewCard/PendingReviewCard.tsx

@@ -6,7 +6,6 @@ import { Switch } from "@/components/atoms/Switch/Switch";
 import { TrashIcon, EyeSlashIcon } from "@phosphor-icons/react";
 import { useState } from "react";
 
-// Type guard for structured review payload
 interface StructuredReviewPayload {
   data: unknown;
   instructions?: string;
@@ -188,7 +187,6 @@ export function PendingReviewCard({
         )}
       </div>
 
-      {/* Review Message - Only show when excluded/rejected */}
       {isDisabled && (
         <div>
           <Text variant="body" className="mb-2 font-semibold">

autogpt_platform/frontend/src/components/organisms/PendingReviewsList/PendingReviewsList.tsx

@@ -18,7 +18,6 @@ export function PendingReviewsList({
   onReviewComplete,
   emptyMessage = "No pending reviews",
 }: PendingReviewsListProps) {
-  // State to track data changes for each review
   const [reviewDataMap, setReviewDataMap] = useState<Record<string, string>>(
     () => {
       const initialData: Record<string, string> = {};
@@ -45,7 +44,6 @@ export function PendingReviewsList({
   const reviewActionMutation = usePostV2ProcessReviewAction({
     mutation: {
       onSuccess: (data: any) => {
-        // Check if the response is successful
         if (data.status !== 200) {
           toast({
             title: "Failed to process reviews",
@@ -58,14 +56,12 @@ export function PendingReviewsList({
         const response = data.data;
 
         if (response.failed_count > 0) {
-          // Partial failure
           toast({
             title: "Reviews partially processed",
             description: `${response.approved_count + response.rejected_count} succeeded, ${response.failed_count} failed. ${response.error || "Some reviews could not be processed."}`,
             variant: "destructive",
           });
         } else {
-          // Complete success
           toast({
             title: "Reviews processed successfully",
             description: `${response.approved_count} approved, ${response.rejected_count} rejected`,
@@ -106,12 +102,10 @@ export function PendingReviewsList({
   }
 
   function handleApproveAll() {
-    // Clear all disabled reviews (approve all)
     setDisabledReviews(new Set());
   }
 
   function handleRejectAll() {
-    // Mark all reviews as disabled (reject all)
     const allReviewIds = reviews.map((review) => review.node_exec_id);
     setDisabledReviews(new Set(allReviewIds));
   }
@@ -126,7 +120,6 @@ export function PendingReviewsList({
       return;
     }
 
-    // Build unified reviews array with approval status
     const reviewItems = [];
 
     for (const review of reviews) {
@@ -138,17 +131,16 @@ export function PendingReviewsList({
       if (isApproved && review.editable && reviewData) {
         try {
           parsedData = JSON.parse(reviewData);
-          // Check if data actually changed
           if (JSON.stringify(parsedData) === JSON.stringify(review.payload)) {
-            parsedData = undefined; // No change, don't send reviewed_data
+            parsedData = undefined;
           }
         } catch (error) {
           toast({
             title: "Invalid JSON",
             description: `Please fix the JSON format in review for node ${review.node_exec_id}: ${error instanceof Error ? error.message : "Invalid syntax"}`,
             variant: "destructive",
           });
-          return; // Exit early on validation failure
+          return;
         }
       }
 
@@ -198,14 +190,12 @@ export function PendingReviewsList({
         ))}
       </div>
 
-      {/* Actions */}
       <div className="border-t pt-6">
-        {/* Quick Actions - small, subtle buttons at the top */}
         <div className="mb-6 flex justify-center gap-3">
           <Button
             onClick={handleApproveAll}
             disabled={
-              reviewActionMutation.isPending || disabledReviews.size === 0 // Already all approved
+              reviewActionMutation.isPending || disabledReviews.size === 0
             }
             variant="ghost"
             size="small"
@@ -217,7 +207,7 @@ export function PendingReviewsList({
             onClick={handleRejectAll}
             disabled={
               reviewActionMutation.isPending ||
-              disabledReviews.size === reviews.length // Already all rejected
+              disabledReviews.size === reviews.length
             }
             variant="ghost"
             size="small"
@@ -227,7 +217,6 @@ export function PendingReviewsList({
           </Button>
         </div>
 
-        {/* Summary and Continue Action */}
         <div className="space-y-4 text-center">
           <div>
             <Text variant="small" className="text-muted-foreground">

autogpt_platform/frontend/src/hooks/usePendingReviews.ts

@@ -3,9 +3,6 @@ import {
   useGetV2GetPendingReviewsForExecution,
 } from "@/app/api/__generated__/endpoints/executions/executions";
 
-/**
- * Hook to fetch pending reviews for the current user
- */
 export function usePendingReviews() {
   const query = useGetV2GetPendingReviews();
 
@@ -17,9 +14,6 @@ export function usePendingReviews() {
   };
 }
 
-/**
- * Hook to fetch pending reviews for a specific graph execution
- */
 export function usePendingReviewsForExecution(graphExecId: string) {
   const query = useGetV2GetPendingReviewsForExecution(graphExecId);