frontend/nextjs/components/Task/AgentLogs.tsx

export default function AgentLogs({agentLogs}:any){  
  const renderAgentLogs = (agentLogs:any)=>{
    return agentLogs && agentLogs.map((agentLog:any, index:number)=>{
      return (<div key={index}>{agentLog.output}</div>)
    })
  }

  return (
    <div className="margin-div">
        <h2>Agent Output</h2>
        <div id="output">
          {renderAgentLogs(agentLogs)}
        </div>
    </div>
  );
}