agent-ecosystem/src/renderer/components/team/dialogs/SkipPermissionsCheckbox.tsx
iliya 3e605622f7 feat: implement tool approval protocol for team management
- Added support for tool approval requests and responses in the team provisioning service.
- Introduced IPC channels for handling tool approval events between main and renderer processes.
- Enhanced the UI to display tool approval requests and allow user responses through new components.
- Updated team launch and creation dialogs to include an option for skipping permissions, integrating with the new tool approval logic.
- Implemented state management for pending approvals in the store, ensuring a seamless user experience during tool interactions.
2026-03-06 21:12:59 +02:00

65 lines
1.9 KiB
TypeScript

import React from 'react';
import { Checkbox } from '@renderer/components/ui/checkbox';
import { Label } from '@renderer/components/ui/label';
import { AlertTriangle, Info } from 'lucide-react';
interface SkipPermissionsCheckboxProps {
id: string;
checked: boolean;
onCheckedChange: (checked: boolean) => void;
}
export const SkipPermissionsCheckbox: React.FC<SkipPermissionsCheckboxProps> = ({
id,
checked,
onCheckedChange,
}) => (
<>
<div className="mt-2 flex items-center gap-2">
<Checkbox
id={id}
checked={checked}
onCheckedChange={(value) => onCheckedChange(value === true)}
/>
<Label
htmlFor={id}
className="flex cursor-pointer items-center gap-1.5 text-xs font-normal text-text-secondary"
>
Auto-approve all tools
</Label>
</div>
{checked ? (
<div
className="mt-1.5 rounded-md border px-3 py-2 text-xs"
style={{
backgroundColor: 'var(--warning-bg)',
borderColor: 'var(--warning-border)',
color: 'var(--warning-text)',
}}
>
<div className="flex items-start gap-2">
<AlertTriangle className="mt-0.5 size-3.5 shrink-0" />
<p>
Autonomous mode all tools execute without confirmation. Be cautious with untrusted
code.
</p>
</div>
</div>
) : (
<div
className="mt-1.5 rounded-md border px-3 py-2 text-xs"
style={{
backgroundColor: 'rgba(59, 130, 246, 0.08)',
borderColor: 'rgba(59, 130, 246, 0.2)',
color: 'var(--color-text-secondary)',
}}
>
<div className="flex items-start gap-2">
<Info className="mt-0.5 size-3.5 shrink-0 text-blue-400" />
<p>Manual mode you&apos;ll approve or deny each tool call in real-time.</p>
</div>
</div>
)}
</>
);