feat: add permission request UI

src/components/chat/AgentWorkspace.tsx

@@ -11,6 +11,7 @@ import MapRounded from "@mui/icons-material/MapRounded";
 
 import { AgentTurn } from "./AgentTurn";
 import { TypingIndicator } from "./GlobalChatbox.parts";
+import type { PermissionReply } from "@/lib/chatStream";
 import type {
   BranchGroup,
   BranchState,
@@ -35,6 +36,7 @@ type AgentWorkspaceProps = {
   onRegenerate: () => void;
   onEditResubmit: (messageId: string, newContent: string) => void;
   onCycleBranch: (rootMessageId: string, direction: -1 | 1) => void;
+  onReplyPermission: (requestId: string, reply: PermissionReply) => void;
 };
 
 type TurnListProps = {
@@ -50,6 +52,7 @@ type TurnListProps = {
   onRegenerate: () => void;
   onEditResubmit: (messageId: string, newContent: string) => void;
   onCycleBranch: (rootMessageId: string, direction: -1 | 1) => void;
+  onReplyPermission: (requestId: string, reply: PermissionReply) => void;
 };
 
 const sameMessages = (left: Message[], right: Message[]) =>
@@ -69,6 +72,7 @@ const TurnListInner = ({
   onRegenerate,
   onEditResubmit,
   onCycleBranch,
+  onReplyPermission,
 }: TurnListProps) => {
   const branchStateByRootId = React.useMemo(() => {
     const next = new Map<string, BranchState>();
@@ -101,6 +105,7 @@ const TurnListInner = ({
             onRegenerate={onRegenerate}
             onEditResubmit={onEditResubmit}
             onCycleBranch={onCycleBranch}
+            onReplyPermission={onReplyPermission}
           />
         );
       })}
@@ -122,7 +127,8 @@ const TurnList = React.memo(
     prevProps.isTtsSupported === nextProps.isTtsSupported &&
     prevProps.onRegenerate === nextProps.onRegenerate &&
     prevProps.onEditResubmit === nextProps.onEditResubmit &&
-    prevProps.onCycleBranch === nextProps.onCycleBranch,
+    prevProps.onCycleBranch === nextProps.onCycleBranch &&
+    prevProps.onReplyPermission === nextProps.onReplyPermission,
 );
 
 TurnList.displayName = "TurnList";
@@ -257,6 +263,7 @@ export const AgentWorkspace = ({
   onRegenerate,
   onEditResubmit,
   onCycleBranch,
+  onReplyPermission,
 }: AgentWorkspaceProps) => {
   const theme = useTheme();
   const latestAssistant = [...messages]
@@ -311,6 +318,7 @@ export const AgentWorkspace = ({
             onRegenerate={onRegenerate}
             onEditResubmit={onEditResubmit}
             onCycleBranch={onCycleBranch}
+            onReplyPermission={onReplyPermission}
           />
 
           {streamingMessage ? (
@@ -327,6 +335,7 @@ export const AgentWorkspace = ({
               onRegenerate={onRegenerate}
               onEditResubmit={onEditResubmit}
               onCycleBranch={onCycleBranch}
+              onReplyPermission={onReplyPermission}
             />
           ) : null}
 
@@ -353,6 +362,7 @@ export const AgentWorkspace = ({
                   onRegenerate={onRegenerate}
                   onEditResubmit={onEditResubmit}
                   onCycleBranch={onCycleBranch}
+                  onReplyPermission={onReplyPermission}
                 />
               </motion.div>
             </AnimatePresence>