- 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.
65 lines
1.9 KiB
TypeScript
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'll approve or deny each tool call in real-time.</p>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</>
|
|
);
|